html - 可滚动嵌套 div - 最大高度 100%

Question

我看过类似的帖子，但没有找到能解决我的具体问题的帖子。

我有一个包含左右两列的布局。在左列中，我有两行。

我希望左列的底行可以滚动，但不会以隐藏顶行的方式滚动。

    <div id="left">
      <div class="top-row-header">
        Some header text
      </div>
      <div class="bottom-row-content">
        Some text. Scrollable independent of the header
     </div>
   </div>
    <div id="right>
      Some scrollable text
    </div>

这是一个 fiddle :http://jsfiddle.net/bec4pm98/

我已经接近了，但是左列中的底行太大了。我希望它根据顶部行的大小自行调整大小。

Answer 1

left-inner div 的高度为 100%，但您还可以将 jumbotron 作为兄弟。将 jumbotron 的高度设置为 20%，将 left-inner 的高度设置为 80%。

示例:http://jsfiddle.net/bL99yds1/

它并不完美，但我在我的手机上，很难修补。你明白了要点。