html – 固定尺寸左列和流体右列均具有100％高度

body { margin:0; padding:0; }
.left-column { position:absolute; top:0; width:235px; height:100%; BACkground:#090909; }
.right-column { margin-left:235px; BACkground:yellow; height:100%; width:100%; }


<div class="page-wrapper">
    <div class="left-column"></div>
    <div class="right-columnr">
        sd
    </div>
</div>

首先,您需要修复右列拼写错误,第二种：当您在元素上设置100％的高度以获取整个屏幕高度时,其父级的高度也应为100％：

CSS：

html,body {
 height: 100%;
 width: 100%;
 padding: 0;
 margin: 0;
}

.page-wrapper {
  height: 100%;
  position: relative;
}

.left-column {
  position:fixed; /* <-- fixes the left panel to prevent from scrolling */
  top:0;
  left:0;
  width:235px;
  height:100%;
  BACkground:#090909;
}

.right-column {
  margin-left:235px;
  BACkground:yellow;
  min-height:100%;  /* <-- fixes the BACkground-color issue when content grows */
}

HTML：

<div class="page-wrapper">
  <div class="left-column"></div>
  <div class="right-column">
    This is the content.
  </div>
</div>

JSBin Demo