title: How do I make right div height equal to dynamically sized left div?
body: <p>See Below for the Self-contained Example</p>
  
  <p><strong>Pictures of what I am trying to do, and what I actually get:</strong></p>
  
  <p>I want to create css rules so that my content looks like this (correct):</p>
  
  <p><img src="https://i.stack.imgur.com/RaLq1.jpg" alt="Correct 1">
  <img src="https://i.stack.imgur.com/RW0Zw.jpg" alt="Correct 2">
  <img src="https://i.stack.imgur.com/LeQPf.jpg" alt="Correct 3"></p>
  
  <p>I am struggling to find a simple solution online, so my content looks like this (wrong):</p>
  
  <p><img src="https://i.stack.imgur.com/V6Ut4.jpg" alt="Wrong 1">
  <img src="https://i.stack.imgur.com/X2rdT.jpg" alt="Wrong 2"></p>
  
  <p><strong>Summary of what I'm trying to achieve:</strong></p>
  
  <p>I couldn't find a solution on stackoverflow or any css blog which provided solutions to similar but incompatible problems.</p>
  
  <p>I have two floated divs, left and right on a row div. The left div contains an image that stretches out until it is the width of the left div. The left div's height is dependent on the img it contains. This is the height that I want the right div to conform to. I need this conformity so that when there is no more room on the right div, the overflow:hidden code will hide the excess text.</p>
  
  <p>Fixed heights are not allowed. <strong>I am trying to avoid Java Script for this</strong>. Is there a solution in pure CSS?</p>
  
  <p><strong>CSS snippet</strong></p>
  
  <pre><code>.left {
      float:left;
      width:50%   
  }
  
  .right {
      float:right;
      width:50%;
      background-color:darkgrey;
      overflow:hidden;
  }
  
  img {
      min-width:100%;
      height: auto;
      width: 100%;    
  }
  </code></pre>
  
  <p>As you can see, I don't have any code here to handle equal div heights because all the solutions I've tried have not worked.</p>
  
  <p><strong>Here is my jsfiddle so you can see the problem:</strong></p>
  
  <p><a href="http://jsfiddle.net/1upodwg9/" rel="nofollow noreferrer">http://jsfiddle.net/1upodwg9/</a></p>