我遇到了与此描述相同的问题thread https://stackoverflow.com/questions/2191029/firefox-rendering-gone-wrong-see-something-really-weird。我想知道是否有其他方法可以达到相同的结果并避免此问题。
显然,即使锚标记的显示 CSS 属性设置为“块”,Firefox 也会遇到包含块元素的锚标记的问题。我想要实现的效果是让整个块可单击,而不是块中的文本。它还允许将悬停状态应用于整个块而不是链接部分。
谁能建议一种技术
EDIT:
这就是我想要展示的:
<div class="entry ">
<a class="link" href="/topics/34/steroids">
<h2>Some Text</h2>
<div class="info">
<div class="tag-visualization">
<div style="width: 67%;" class="guage"></div>
</div>
<ul class="stats">
<li>
<strong>0</strong><br>FOLLOWERS
</li>
<li>
<strong>2</strong><br>ANSWERS
</li>
<li>
<strong>2</strong><br>QUESTIONS
</li>
</ul>
</div>
</a>
</div>
这是 Firefox 渲染的结果:
<div class="entry ">
<a class="link" href="/topics/45/diet">
</a><h2><a _moz-rs-heading="" class="link" href="/topi/45/diet">sometext</a></h2>
<a class="link" href="/topics/45/diet"> </a><div class="info">
<a class="link" href="/topics/45/diet">
</a><div class="tag-visualization">
<a class="link" href="/topics/45/diet"> </a><div style="width: 67%;" class="guage"></div>
<a class="link" href="/topics/45/diet"> </a></div>
<a class="link" href="/topics/45/diet"> </a><ul class="stats">
<a class="link" href="/topics/45/diet"> </a><li>
<a class="link" href="/topics/45/diet"> <strong>0</strong><br>FOLLOWERS
</a></li>
<a class="link" href="/topics/45/diet"> </a><li>
<a class="link" href="/topics/45/diet"> <strong>2</strong><br>ANSWERS
</a></li>
<a class="link" href="/topics/45/diet"> </a><li>
<a class="link" href="/topics/45/diet"> <strong>2</strong><br>QUESTIONS
</a></li>
<a class="link" href="/topics/45/diet"> </a></ul>
<a class="link" href="/topics/45/diet"> </a></div>
<a class="link" href="/topics/45/diet"> </a>
</div>
当我通常需要一个<div>
里面一个<a>
,我用一个<span>
而是用display:block;
。不会因上述错误而破坏 Firefox 中的布局,并且其行为与<div>
does.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)