需要修复网站的宽度以删除水平滚动条

时间:2012-07-07 19:10:08

标签: html css width

我只是想删除水平条。我正在以1280x800的分辨率浏览网站,所以不管怎样都不应该有水平条。

它发生在chrome,firefox和safari中。

您可以访问该网站:http://ilmioforno.com

我的代码是,

 body {
background: #f1eee3;
color: #111;
margin: 0;
   }
 #page {
   border: solid black 4px;
   clear: both;
}

 #wrap { 
   clear: both; 

    }

 #content {
    margin: 0 auto;
    padding: 20px;
    border-radius: 10px;
    moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background: #b63b3b;
    border: 3px solid #942a2a;
    color: #51301f;
    font-size: 13px;
    width: 65%;


}

3 个答案:

答案 0 :(得分:2)

你可以使用CSS属性overflow-x 例如:

#content
{
overflow-x:hidden;
}

它将删除水平滚动条...

您可以在此网站上试用 http://www.w3schools.com/cssref/css3_pr_overflow-x.asp

答案 1 :(得分:2)

问题是div#nav它有一个span-24,它将宽度设置为950px,而你还有360px左边距。这有效地实现了1310px的总宽度,因为您没有将溢出隐藏在任何包含元素上。您需要调整导航的宽度。我假设您的整体听众/页面为950,这意味着您的导航最多应为950 - 360 = 590

答案 2 :(得分:1)

maring-left移除#nav

#nav {
   color: #51301F;
   /*maring-left: 360px;*/
   margin-top: -120px;
   font-weight: bold;
   font-size: 22px;
   text-transform: uppercase;
   background: none;
}

并将其添加到.menu

.menu{
   maring-left: 360px;
}