html - Bootstrap 导航对齐失败

标签 html twitter-bootstrap css web

我正在尝试使用 Bootstrap 构建网页。我使用 nav-justified 类创建了一个导航栏。然后我在 safari 和 chrome 上运行它,但是出现了这个问题: 当我拖动窗口以将其调整为较小的大小然后调整为原始大小时,这些选项卡堆叠在一起。为什么会发生这种情况,我该如何避免这种情况?这是 bootstrap V3.1.1。

原文: correct one 叠一: stack together

<!DOCTYPE html>
<html>
  <head>
    <link href="./css/bootstrap.css" rel="stylesheet">
  </head>

  <body>
    <div class="container">
        <ul class="nav nav-justified">
          <li class="active"><a href="#">1</a></li>
          <li><a href="#">2</a></li>
          <li><a href="#">3</a></li>
          <li><a href="#">4</a></li>
          <li><a href="#">5</a></li> 
          <li><a href="#">6</a></li>
          <li><a href="#">7</a></li>
          <li><a href="#">8</a></li>  
        </ul>
    </div>
  </body>
</html>

最佳答案

Bootstrap docs提到一个bug in Safari关于它无法正确处理列网格的小数百分比。

错误报告中有一些关于人们如何解决找到解决此问题的方法的轶事。

关于html - Bootstrap 导航对齐失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23577171/

相关文章:

html - 如何使嵌套的 div 半透明以显示 body 标签背景图像?

html - float div 影响我屏幕中其他 div 的高度

javascript - 使用 Canvas 引擎和平铺 map 编辑器获取 "Uncaught TypeError: Cannot read property ' firstgid' of undefined"

html - 为什么我的 Bootstrap 不工作?

javascript - 如何使用 getElementsByClassname 选择两个输入字段?

css - 当我运行我的 jsp 页面时,只打印了一半的表单

css - 对话框被顶部导航栏隐藏

CSS:直接后代选择器。它选择不是直接子元素的元素

html - Div 没有填满页面

javascript - jquery 获取表单 DIV 的数据到 PHP $_POST