Html 2列布局，第一列固定宽度，100%高度，第二列100%宽度和高度

我用

display:table cell

成功地实现了这一点，但我遇到了一个问题，在

table cell

中实现了massy.js，它根本不起作用

所以我必须用普通的div来做这个

我需要左列的宽度为

40px

，高度随内容的增加而增加。主列需要

100%

宽度或动态占用剩余空间

Rigth现在我有了这个，它在结构上有效，但不适用于砌体.js
CSS

div#wrapper{
display:table; 
height:100%; 
width:100%;
}
div#sidebarWrapper{
display:table-cell; 
min-width:40px; 
height:100%; 
background-color:#444;
}
div#contentWrapper{
display:table-cell; 
height:100%; 
position:relative;
}
div#content{
border-left:1px solid #ddd; 
border-top:1px solid #ddd; 
overflow:hidden; 
padding-bottom:100px; 
margin-top:195px;
}
div.clear{clear:both;} 

HTML

  <div id="wrapper">
        <div id="sidebarWrapper">
          </div> <!-- sidebar wrapper -->

          <div id="contentWrapper">
            <div id="content">
            </div><!-- content-->
            <div class="clear"></div>
          </div><!-- wrapper wrapper -->
      </div><!-- site wrapper -->

---

基本上，我需要一个没有表格的版本。非常感谢您的帮助。

我想您需要第二列流体，所以

（制作了另一个演示，

溢出：隐藏；

在子元素上不是必需的）

我想你不需要在这里做任何解释，因为一切都是不言自明的，已删除

overflow:hidden来自子元素，该子元素在您的案例中不是必需的

<div class="wrapper">
    <div class="left_container">Hello</div>
     <div class="right_container">World this is just a random junk text</div>
</div>

html, body {
    height: 100%;
}

.wrapper {
   height: 100%;
}

.left_container {
    float: left;
    width: 200px;
    background: #f00;
    min-height: 100%;
}

.right_container {
    min-height: 100%;
    background: #000;
    margin-left: 200px;
    color: #f00;
}

（附内容）

编辑：外星人先生的想法是对的，我只是做了一点调整：）

等待不可能这么简单，我尝试了所有愚蠢的重复背景、计算、flexbox等，你告诉我它只是最小高度？给我一分钟来测试一下。@UzumakiDev您需要将父级
height
设置为
100%
以及：）@UzumakiDev为
height
问题添加了jQuery。。。如果不使用jQuery，看看会发生什么啊是的，谢谢，高度问题是我第一次遇到的问题，然后切换到表。Jquery修复似乎是目前最好的解决方案，非常感谢：）@UzumakiDev-ya-sure:）
$(function(){
    $(window).resize(function(){
        var documentHeight = $(document).height();
        $('.left_container').css('height',documentHeight + 'px');
    }).resize();    
});

jQuery(function($){
    $(window).resize(function(){
        var containerHeight = $('.right_container').height();
        $('.left_container').css('height',containerHeight + 'px');
    }).resize();    
});