Problem with Internet Explorer Padding

匿名 (未验证) 提交于 2019-12-03 08:44:33

问题:

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!

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 Result (which is what I want):

alt text http://img33.imageshack.us/img33/8280/linkissueff.jpg

Internet Explorer (7) Result (incorrect padding):

alt text http://img22.imageshack.us/img22/8555/linkissueie.jpg

How can I fix this to work in IE? Many thanks in advance!

回答1:

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>


标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!