Question

在常规版本，宽版本和平板电脑版本中，只要窗口离site_wrap容器大约一英寸远，就会出现滚动条，水平滚动显示。我可以看到，如果我从div#title移除25px的宽度，则滚动消失。

我无法理解的是，容器（site_wrap）是1280px，div.title_wrapper是自动的，div#title是1234px，左边距是46px。

http://brainbuzzmedia.com/themes/expression/blog/

Answer 1

只需定义您的#site_wrap

即可

margin:0 auto和overflow: hidden 就像这样

div#site_wrap {
margin: 0 auto;
overflow: hidden;
}

Css路径就是这个

http://brainbuzzmedia.com/themes/expression/wp-content/themes/expression/css/bgs/gradient.css

Answer 2

这是因为Blog菜单，它被隐藏（不透明度为0）但显示不是none，这意味着它仍然需要流动它的位置。

你可以通过将display：none设置为ul元素来检查这一点。

<li id="menu-item-813" class="menu-item menu-item-type-post_type menu-item-object-page     current-menu-item page_item page-item-178 current_page_item menu-item-813"><a href="http://brainbuzzmedia.com/themes/expression/blog/">Blog</a>
<!-- this--><ul class="sub-menu">

你应该正确设置它的位置，以免过度流动文件。

Answer 3

在导致此问题的不同@media查询中似乎存在一些错误计算。您可以通过添加以下内容轻松摆脱整个水平滚动条（因为不需要它）：

body { 
    overflow-x:hidden;
}

Answer 4

问题出在.title_wrapper或更准确的.navline范围内。你应该添加

.navline {
   overflow: hidden;
}

导致水平滚动出现的原因是什么？

4 个答案: