title: Divs stacked horizontally for liquid layout where one of the widths will change?
body: <p>Below is my code and fiddle: <a href="http://jsfiddle.net/hehUt/2/" rel="nofollow">http://jsfiddle.net/hehUt/2/</a></p>
  
  <pre><code>&lt;div class="one"&gt;&lt;/div&gt;
  &lt;div class="two"&gt;text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text heretext here text here text here  text here text here text here text here text here text here text here re text here text here text here text here text here text here text here text here text here text here text here text here text here text here text here text heretext here text here text here  text here text here text here text here text here text here text here 
  &lt;/div&gt;​
  .one {
      background-color: red;
      height: 75px;
      width: 75px;
      float: left;
  }
  .two {
      margin-left: 75px;
  }​
  </code></pre>
  
  <p>I want the 2 divs to sit side by side in a liquid layout and take up all the available space. I also want the text to not wrap after the image but instead to stay vertically aligned. This is all working fine.</p>
  
  <p>However say the width of the  div.one changed I would need to change the margin applied to div.two. Is there a way around this? Eg if the width of div.one was set by content from a CMS as so varied, would I need to get the CMS to apply a margin px value to div.two or is there a CSS solution that would work for different widths of div.one? Thanks </p>