Question

在FireFox中查看this page。您可以随意导航到前六个产品类别中的任何一个，以查看更多相同类型的代码。

如果你有幸看到故障，你会看到至少有一个产品盒将它的高度扩展到史诗般的比例。

以下是代码：

<div class="product_category">
  <a href="../products/dht_1500.php" style="height: 340px;">
    <h3>DHT 1500</h3>
    (superfluous HTML omitted here)
  </a>
</div>

这是Firebug揭示的内容：

<div class="product_category">
  <a style="height: 340px;" href="../products/dht_1500.php"> </a>
    <h3><a _moz-rs-heading="" style="height: 340px;" href="../products/dht_1500.php">DHT 1500</a></h3>
    (superfluous HTML omitted here)
  <a style="height: 340px;" href="../products/dht_1500.php"> </a>
</div>

你可以看到FireFox肯定正在关闭我的标签并再次重新打开它们，并随之拉动自定义CSS高度样式，这导致每个产品盒高度暴涨。还要注意奇怪的 _moz-rs-heading =“”位。

我怀疑我的问题与我在内联标记中使用块HTML元素有关，但我认为我通过在样式表中将标记转换为块格式来解决了这个问题：

.product_category a {
    display: block;
}

FireFox正在为我的代码播放收藏夹。它通常会像我想要的那样呈现页面，但随后每隔一段时间，它会将我的产品盒中的一个打得天高，似乎是随机的。

这些页面在Internet Explorer和Safari中正常运行。我在Mac上使用FireFox 3.6进行了测试，但在FireFox for PC上也遇到了同样的问题。

Answer 1

在内联元素（a）中包含块级元素（h3）是无效的HTML。

将块元素更改为范围，并使用CSS根据需要设置样式。

Answer 2

几天前就被问到了具有完全相同症状的

A similar question。实际上，解决方案是将本机块元素从本地内联块中取出。在这种情况下，似乎更改display无效。

为什么FF3在<a> incorrectly?</a> </h3>内呈现<h3>

2 个答案: