0

经过深思熟虑后，我刚刚切换到 ZURB Foundation 4（从 Twitter Boostrap 3 RC1 切换），这一切都很好，但我担心我可能已经遇到了一些错误——但错误可能是我的方式也许我正在使用它？

基本上，我正在设置一个块网格，其中包含一系列图像。最初它按预期工作：图像自动缩放到其列的宽度，这是有道理的，因为它们有max-width:100%和height:auto。

现在，当我添加class="th"到图像的每个锚点时，图像突然溢出它们的容器并且根本不受大小限制，而是图像文件本身的尺寸。

在 Firefox 中检查这一点，我发现可能导致这种情况的唯一区别是th该类具有line-height:0. 我对所有这些东西都有些陌生，所以我不太明白他们为什么将行高设置为零，但据我所知，这就是破坏我使用中的一切的原因。这是一个错误还是我错过了什么？

这是一个代码示例：

<ul class="large-block-grid-4">
   <li>
      <a class="th" href="http://placehold.it/800x800.jpg">
         <img src="http://placehold.it/800x800.jpg" />
      </a>
   </li>
</ul>

即它到处溢出，但如果我只是删除th类，那很好。

对我来说这看起来像是一个错误，但在我提交之前，我想确保我不是白痴并且错过了一些重要的点。

4

2 回答 2

1

我一直在使用默认的 CSS（v4.3.1）而不是 SASS 来解决同样的问题。仅对我而言，它仅发生在 IE 10/9 中。在比较用于文档的样式表和下载中包含的样式表时，我发现了一个不同之处。

将以下内容添加到“a.th”样式中：

max-width: 100%;
于 2013-08-17T23:54:05.760 回答
0

它不应该溢出。http://foundation.zurb.com/docs/components/thumbnails.html

你是在使用 sass 还是仅仅在他们的 css 之上工作？

于 2013-08-06T21:59:17.967 回答