我正在为一些本地企业建立一个网站,但我无法弄清楚是什么导致了横向滚动。我一定是真的累了,在某个地方搞砸了。任何和所有的帮助都会很棒。该网站的链接 http://theparkwayrv.com
如果你看,你会看到有一个横向滚动条。如果你能弄清楚,请告诉我。我已经复习了 10+ 次,我现在正在失去理智。
谢谢!
添加
body {overflow-x: hidden;}
到你的 CSS。
通常,这是因为页面中将width
或min-width
设置为100%
或100vw
的项目。当浏览器向其添加垂直滚动条(Chrome 中为 17px)时,它会使其100% + 17px
,因此需要添加水平滚动。但是,这不会发生在大多数移动UI和任何使用semi-transparent-show-on-scroll-only
滚动条的浏览器上。
正如 Tersosauros 非常发现的那样,唯一一个没有像我们其他人一样提供快速修复的人实际上花时间寻找body
额外宽度的真正原因,在您的特定情况下,这是由于错误地使用了 Bootstrap 类。您独立使用了.row
,而不是.container
的直接子级,并且页面更宽,30px
。
但是,快速修复仍然可以解决它。至少在这一生中,我们主要为解决方案付费,而不是为正确而付费。右?:)
是由.row
(第 #7 行,bootstrap.min.css)上的15px
左右边距影响parkway_about_page
div
中的子div
引起的。 这是Bootstrap期望您的页面结构的一部分,正如@Andrei Gheorghiu所指出的那样。 如果parkway_about_page
也是一个.container
引导程序会为您解决此问题。
任何一种选择都为我修复了它:
- 添加(正如许多其他没有解释的 1 行答案所建议的那样)
overflow-x: hidden;
到#parkway_about_page
.
---或---
- 从
parkway_about_page
下方的.row
div
中删除边距(或完全删除类)。
将这个 css 用于你的正文部分:
body{overflow-x: hidden;}
试试这个...
body {
overflow-x:hidden;
}
添加到您的 CSS 文件中:
body{
overflow-x: hidden;
}
在正文中只是把overflow-x: hidden