Bootstrap 悬停时导航栏展开

Question

所以我刚刚将我正在处理的项目的导航栏更新为 Bootstrap 导航栏。我稍微修改了 Bootstrap 。当我添加 width: 80%; 和 margin-left: 20%; 以使导航栏跨越整个页面并且 在最左边 和 "brand" 时，问题似乎发生了。您可以在此处查看问题：http://output.jsbin.com/mumuna. Source code: https://github.com/CSGOFlair/dev

Answer 1

这是因为您在悬停时为锚标记添加边距。

所以，改变：

li a:hover {
    background-color: #00a8a8;
    margin: 25px 10px;
}

第 47 行 https://github.com/CSGOFlair/dev/blob/gh-pages/css/stylesheet.css 到

li a:hover {
    background-color: #00a8a8;
    margin: 0px;
}

Bootstrap 悬停时导航栏展开

Bootstrap Navbar Expanding on Hover

html

css

navbar