1

我遇到了 100% 高度 div 的问题。

到目前为止，如果您使用andposition:fixed向下滚动，我已经习惯避免出现空白。这很好用，但是如果您水平滚动，则 div 不会随着页面的其余部分滚动。top:0bottom:0

我已将其定位在距其容器左侧 20px 的位置，并且当浏览器不比文档窄时它保持在正确的位置，但是当它是问题开始时。

编辑：绿色的 div 应该表现得像灰色的，当你水平滚动而不是停留在原地时会移动。

在这里你可以找到代码：

<div style="width: 1200px; margin: 0 auto; padding-bottom:50px">
  <div style="background-color: #CFC; width: 340px; position:fixed; margin-left: 20px; top:0px; bottom:0px"></div>
  <div style="background-color: #CCC; width: 340px; height: 395px; position: absolute; margin-left: 20px; top: 0px"></div>
  <div style="box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.8); margin-top: 60px">
    <div style="background-color: #FFF; width: 1200px; height: 260px"></div>
    <div style="background-color: #666; width: 1200px; height: 26px"></div>
    <div style="background-color: #FFF; width: 1200px; min-height: 500px"></div>
  </div>
</div>

jsFiddle - http://jsfiddle.net/q7tEE/

4

1 回答 1

1

这是一个工作 jsFiddle。

您需要position:absolute在绿色 div 上使用，而不是position:fixed希望它像灰色 div 那样水平滚动。

.greenbg {
    background-color: #CFC;
    width: 340px;
    height:896px;
    position:absolute;
    margin-left: 20px;
    top:0px;
    bottom:0px
}
于 2013-03-28T13:08:08.327 回答