问题描述
我无法在< a>标记周围添加IE填充,以使其正常工作。这仅适用于Firefox,Safari,Chrome,但不适用于IE-请帮助!
I can't get IE padding around my <a> tags to work correctly. This only works in Firefox, Safari, Chrome, but not IE - please help!
我的简化HTML代码如下:
My simplified HTML code looks like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<div id="mydiv">
<table>
<tr>
<td>
<a style="padding: 20px; background: red;" href="#">Some link</a>
</td>
</tr>
</table>
</div>
</html>
Firefox的结果(这就是我想要的):
Firefox Result (which is what I want):
Internet Explorer(7)结果(填充不正确):
Internet Explorer (7) Result (incorrect padding):
我该如何解决此问题IE浏览器?
How can I fix this to work in IE? Many thanks in advance!
推荐答案
对于自然内联的元素,IE要求该元素具有 display:inline-block;
css属性,然后再应用 padding
之类的属性。因此,只需在锚元素中添加 display:inline-block
。
For elements which are naturally inline, IE requires that the element have the display: inline-block;
css property before it will apply properties like padding
. So just add display: inline-block
to your anchor element.
<a style="display: inline-block; padding: 20px; background: red;" href="#">Some link</a>
这篇关于在< a>周围填充标签在Internet Explorer中不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!