css - Bootstrap 布局在宽显示器上表现得很奇怪

Question

我一直在使用 Bootstrap 在一个网站上工作，一切都进展顺利，直到我在宽显示器上查看了一些东西。

如果您查看此页面，您可以在 3 行中看到不同的公司徽标（第一行和第二行 5 个，第三行 2 个）。但是，如果我将浏览器扩展得尽可能宽，您会看到一切都开始变得有些奇怪。有什么想法可以简单地解决这个问题吗？

Answer 1

我假设您的意思是，当在宽显示器上查看时，某些徽标会脱节 - 尝试在 css 的这一部分中删除 width:170px 规则：

@media (min-width: 1200px)
.span2 {
width: 170px;
}

Answer 2

那是因为您没有在父 div 上指定跨度类或宽度

试试这个：（在你的课堂上添加“span12”）

<div class="row span12" align="center">
        <div class="span2 offset1" id="hankook" align="center"><img src="img/hankook_logo.png" alt="hankook tires"></div>
        <div class="span2" id="geotrac" align="center"><img src="img/geotrac_logo.png" alt="geo trac tires"></div>
        <div class="span2" id="nankang" align="center"><img src="img/nankang_logo.png" alt="nankang tires"></div>
        <div class="span2" id="geostar" align="center"><img src="img/geostar_logo.png" alt="geostar tires"></div>
        <div class="span2" id="milestar" align="center"><img src="img/milestar_logo.png" alt="milestar tires"></div>
    </div>