0

我四处寻找答案，但似乎找不到任何东西（也许我使用了错误的关键字）。我正在将 Bootstrap 与以下网格系统一起使用。22 个网格，每个 47px 宽，每个网格之间的边距为 0。这意味着对于每 4 个网格，我总共有 188px。每 4 个网格包含两个图像，一个 1 像素的垂直条和一个 187 像素的徽标。

这应该足以并排显示两个图像，但徽标不断被踢下。如果我放在 class="pull-left"竖条上，徽标将回到它们应该在的位置，直到我缩小浏览器窗口的最小量以使流体行调整大小。

起初我认为这可能只是列的容差/舍入问题，所以我将图像缩小了 5px，但这并没有改变任何东西。关于可能导致此问题或如何解决此问题的任何想法？唯一适用于此的 CSS 是标准bootstrap.css样式表和 1040 像素的最大正文宽度。

<div class="row-fluid ">
    <div class="span4 offset1">
        <img src="img/verticalBar.jpg">
        <img src="img/logo1.jpg">
    </div>
    <div class="span4">
        <img src="img/verticalBar.jpg">
        <img src="img/logo2.jpg">
    </div>
    <div class="span4">
        <img src="img/verticalBar.jpg">
        <img src="img/logo3.jpg">
    </div>
    <div class="span4">
        <img src="img/verticalBar.jpg">
        <img src="img/logo4.jpg">
    </div>
    <div class="span4">
        <img src="img/verticalBar.jpg">
        <img src="img/logo5.jpg">
        <img src="img/verticalBar.jpg">
    </div>
</div>

这是页面当前的样子。红色箭头指示徽标的位置。 在此处输入图像描述

4

1 回答 1

-1

尝试将此添加到您的CSS：

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, del, dfn, em, img, ins, kbd, q,      samp, small, strong, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, table, tbody, tfoot, thead, tr, th, td, article, aside, footer, header, nav, section {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}
于 2013-02-20T23:15:30.633 回答