css根据div容器的高度制作图片高度

Question

HTML代码:

<div id="container">
  <div id="sidebar">
    <img src="http://photojournal.jpl.nasa.gov/jpeg/PIA17555.jpg" width="222px">
  </div>

  <div id="content">
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p>
    <p>Main content</p
 </div>   

访问http://jsfiddle.net/dlamichhane/Hv2mq/1/了解详细代码场景。

我有一个包含两个 div 的主 div 容器。在第一个 div 中，它只包含图像标签，在第二个 div 中，内容的大小动态增长(有时内容较少，有时内容较多)。在这种情况下，如何使图像的高度适合主 div 容器的高度。注意:图片不应被拉伸(stretch)。

Answer 1

我认为没有简单直接的答案。有几种不同的方法可以实现这一点，一篇关于此的广泛文​​章是 Fluid Width Equal Height Columns关于 css 技巧。