0

所以我做了一个网站,我有一个包装器 div。然后内容居中并获得 100% 的高度,以确保填充浏览器的视图区域。奇怪的是主 div 有一个边框。如果我让我的浏览器变小并使用滚动器在页面上下来。然后边框仅显示在视图区域中的 div 部分。当我向下滚动时,没有在 div 的其余部分设置边框。其他人有这个问题吗?我似乎无法在 google 中找到有关此特定问题的任何信息。

这是我的基本布局

<html>
<head>
  <style>
html, body {
 background: url('../img/subtle-circles-pattern-2268.png') left top repeat;
 height: 100%;
 margin: 0;
 padding: 0;
 font-family: Tahoma, Geneva, sans-serif;
 font-size: 13px;
 color: #666;
}

#wrapper {
    z-index:1;
    width: 100%;
    height: 100%;
    min-height:100%;
    text-align: center;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
}

#content {
    margin: 0px auto;
    width: 940px;
    height: 100%;
    border-left: 1px solid #c3c3c3;
    border-right: 1px solid #c3c3c3;
    background-color: #FFF;
    text-align: left;
}
</style>  
</head>
    <body>
         <div id="wrapper">
              <div id="content">
                   alot of content<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
                   <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
                   <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
              </din>
        </div>
   </body>
</html>
4

1 回答 1

1

您必须从内容 ID 中删除 Height 属性,ID 的高度将根据您页面上的内容量计算,因此您的 css 应该像

#content {
            background-color: #FFFFFF;
            border-left: 1px solid #C3C3C3;
            border-right: 1px solid #C3C3C3;
            margin: 0 auto;
            text-align: left;
            width: 940px;
        }
于 2013-06-09T17:56:21.247 回答