Firefox bug:链接块元素之外的链接

Question

我之前听说过Firefox在块元素周围的链接存在一个主要问题,最近它给我带来了一些问题.

有时(可能是20%的速率),由于某种原因,更改此代码(请注意,所有元素都定义为样式表中的块元素):

<li>
  <a href="product.htm">
    <img src="product-image.jpg" width="100" height="100" alt="Product image" />
    <h2>Product title</h2>
    <p>Product description</p>
  </a>
</li>

进入:

<li>
  <a href="product.htm">
    <img width="100" height="100" alt="Product image" src="product-image.jpg">
  </a>
  <h2>
    <a _moz-rs-heading="" href="product.htm">Product title</a>
  </h2>
  <p></p>
  <p>
    <a href="product.htm">Product description</a>
  </p>
</li>

这迫使样式表以完全错误的方式显示元素; 我使用a元素在webshop产品列表中获取包含产品图像,标题和描述的大链接.

我想要那些大链接,但却找不到另一种方法来做到这一点.你会建议什么？

Answer 1

我不知道资源xhtml.com有多权威,但他们确实说a标签只能包含:

• 内联元素,除了a,在任何深度
• 文本

一种可能的解决方案是重新组织HTML以使其更有意义(例如,不要尝试将块级元素放在内联级元素中).只需要一个产品的链接(可能在h2中,或在图像周围).然后使用JavaScript检测其上的任何位置的单击li,并加载链接.

这有任何意义吗？这是一个例子.