html - 如何删除在移动菜单上使用 Twitter Bootstrap 时出现的水平滚动条

标签 html css twitter-bootstrap

请帮帮我。 我设置了一个 Twitter Bootstrap 菜单的样式,但是当我在移动版本上时出现了一个水平滚动条:

http://i.imgur.com/JRWRg9D.jpg

我能够在 jsfiddle 上重现它:

http://jsfiddle.net/mXLSk/

我正在使用它来设置移动版本的样式,但必须在某处隐藏另一种样式才能让滚动条出现。

 @media (max-width: 767px) { 
    #bs-example-navbar-collapse-1 {
        background-color: #fff;

        a {
            padding: 7px 40px;
        }
    }
 }

谢谢你的帮助。

最佳答案

.navbar-nav 使用负边距导致内容流出容器。这就是滚动条的最终原因。将其更改为正填充应该可以解决它 =)

.navbar-nav {
    margin: 0;
    padding: 7.5px 15px;
}

JSfiddle to the padding / margin change.

关于html - 如何删除在移动菜单上使用 Twitter Bootstrap 时出现的水平滚动条,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24084077/

相关文章:

html - Ios 浏览器上的 Bootstrap - html 中的边框和文本

javascript - 在多步骤表单中单击上一步时 CSS 发生变化

html - 将相同的 DIV 两次放在同一行中,它们之间有空格

html - CSS float :right and vertical align?

css - 使用 Bootstrap 格式化 WebGrid 不会按预期显示颜色

javascript - 搜索多个用户的输入并显示其中最常用的词

html - html5中的<figure>标签可以用于背景图片吗?

javascript - 围绕父级中点居中多个元素

html - 响应时两个 Bootstrap 行未正确对齐

php - bootstrap col 位置不会显示在旁边,总是显示在底部