html - 如何从 HTML 页面中删除长的水平滚动条

Question

我正在使用 twitter bootstrap 启动一个项目，但是我遇到了一个问题。水平方向有一个长的空滚动条。我找不到问题，有谁知道是什么问题？

谢谢

Answer 1

<style>
body {
  overflow-x: hidden !important;
}
body > * {
  max-width: 100% !important;
}
</style>

Answer 2

media="all"
style.css:1@media (min-width: 1200px)

.container, 
.navbar-static-top .container, 
.navbar-fixed-top .container, 
.navbar-fixed-bottom .container {
    width: 1270px;
}

改成

.container, 
.navbar-static-top .container,
.navbar-fixed-top .container, 
.navbar-fixed-bottom .container {
    width:auto;
}

或者删除container底部地图上的类，container用于包装内容，不应包装到其他container. 容器也将占据全宽。

在 a 中的任意位置放置一个.container，它设置您的站点和内容的宽度。

'引导文档'

查看模板

Answer 3

希望这可以帮助 ！！

1）在标题中添加以下内容以启用响应功能

<meta name="viewport" content="width=device-width, initial-scale=1.0">

2) 如果您使用的是容器流体

正确使用row-fluid和span喜欢：

<div class="container-fluid">
<div class="row-fluid">
    <div class="span2">
        <!--Sidebar content-->
    </div>
    <div class="span10">
        <!--Body content-->
    </div>
</div>

这里可能有一些标签错误..

3）忘记在body中添加overflow-x hidden。

body {
    overflow-x: hidden;
}

关联