0

所以我弄乱了我的网站 CSS，突然间总是有一个水平滚动条，我的导航栏并没有一直走到尽头，即使它的宽度设置为 100%。这是个常见的问题吗？我查看了我的 CSS 值，没有一个足以使页面需要扩展。

编辑：代码

html {
 height:100%; 
}

.content {
    width:269px;
    margin-left: auto;
    margin-right: auto;
    }
.home {
    width:100%;
    margin-left: auto;
    margin-right: auto;
    text-align:center;
    font: bold x-large verdana, arial, helvetica, sans-serif;
    padding-top:10px;
    }
.home a:visited {
    color: blue;
    }

.head {
    width:100%;
    text-align:center;
    padding: 15px; 
    font: bold x-large verdana, arial, helvetica, sans-serif;
    }

.foot {
    width:100%;
    text-align:center;
    padding: 20px; 
    font: normal medium verdana, arial, helvetica, sans-serif;
    }
body { 
    background-color: #FFF; 
    margin: 0px; 
    padding: 0px; 
    font: normal medium verdana, arial, helvetica, sans-serif;
}


div#navbar2 {
    height: 50px;
    width: 100%;
    border-top: solid #000 1px;
    border-bottom: solid #000 1px;
    background-color: #336699;
    text-align:center;
}
div#navbar2 ul {
    margin: 10px;
    padding: 0px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-large;
    color: #000;
    line-height: 30px;
    white-space: nowrap;
}
div#navbar2 li {
    list-style-type: none;
    display: inline;
}
div#navbar2 li a {
    text-decoration: none;
    padding: 11px 20px;
    color: #FFF;
}
div#navbar2 li a:link {
    color: #FFF:
}
div#navbar2 li a:visited {
    color: #FFF;
}
div#navbar2 li a:hover {
    color: #FFF;
    background-color: #3366FF;
}
4

3 回答 3

2

你的页脚有宽度：100%；但也有左右填充

你总是需要计算填充和宽度。

编辑：与您的 .head 相同

于 2012-04-16T06:43:34.770 回答
1

隐藏溢出使用的东西：溢出：隐藏；

于 2012-04-16T06:22:40.843 回答
0

只需将此 css 属性添加到您的 body 元素样式中。

overflow-x:hidden

它将删除水平滚动条并肯定会防止右侧出现额外的空白。

于 2016-05-30T09:28:50.980 回答