我的CSS和HTML有什么问题？（使用Twitter引导和字体）

我遇到了一个非常奇怪的问题，Safari web浏览器显示的网站与Firefox稍有不同

我正试图在Twitter引导程序中设置一些大字体的很棒的图标

容器在Safari上看起来像这样（正是我想要的）：

像Firefox一样：

HTML在这里：

<div class="container">
  <div class="row-fluid"> 
    <div class="span4 center front">
      <i class="icon-thumbs-up"></i>
      <div class="showcase">
      <h1>Heading</h1>
      <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
      <p><a class="btn" href="#">Read more &raquo;</a></p>
      </div>
    </div>
    <div class="span4 center front">
      <i class="icon-thumbs-up"></i>
      <div class="showcase">
      <h1>Heading</h1>
      <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui. </p>
      <p><a class="btn" href="#">Read more &raquo;</a></p>
      </div>
   </div>
    <div class="span4 center front">
      <i class="icon-thumbs-up"></i>
      <div class="showcase">
      <h1>Heading</h1>
      <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa.</p>
      <p><a class="btn" href="#">Read more &raquo;</a></p>
      </div>
    </div>

---

编辑： 正如John已经建议的那样，我设法删除了.showcase栏，但大字体的令人敬畏的图标仍然没有完全对齐。我制作了另一个jsfiddle，将

.front

类边距顶部更改为70px

在Safari中它看起来是这样的，

margintop:70px添加到
.front
类


在Firefox上使用相同的CSS


我猜你的浏览器中有一些缓存的CSS。您为
.showcase
设置了
页边距顶部
：

.showcase {
  margin-top: 125px;
}

删除它将修复带有边距的问题



对于引导程序3：

在引导程序3中，
.span*
替换为
.col md-*

看

因此，用
col-md-4
替换
span4
可以解决这个问题。
为什么要使用
标记？哦，我忘了指出我没有使用Bootstrap 3.0，所以这个解决方案可能不会有多大帮助。@maku你能把这个问题复制到JSFIDLE中吗？基本上，我需要大字体的可怕的图标坐在正上方的h1。（它们之间只有大约20px）谢谢你的帮助，John，但现在情况正好相反-在Firefox中看起来都不错，但在Safari中却一团糟：/@maku如果你确定这是Safari的问题，最好在Safari中报告它。。。在修复之前，您可以进行检查：。这将是解决问题的一种方法。
.showcase {
  margin-top: 125px;
}