Forum Moderators: not2easy
Message Too Old, No Replies
Dotted underline on links in IE7
Everything works in every other browser, including IE8. Everything appears fine in IE7 except the dotted line. I have a sneaking suspicion I have seen this issue before...
<body class="login">
<div class="heading">
<p class="alt-action">or <a href="login">Log In</a></p>
</div>
</body>body.login .alt-action a {
margin:0 0 0 4px;
padding-bottom:1px;
border-bottom:1px dotted;
text-decoration:none;
color:#134B57;
}
Sometimes simple test cases create their own problems ;)
In this case ie7 is calculating the heights as too small to allow room to draw the border.
See this in action by applying a border to the p (the <a> border will appear, but slightly below the border for the <p> ), or insert a line-break and some words.
The easy fix is to set a line-height - it is good practise, and your working css is likely to have one anyway.
Join The Conversation
- Register For Free! - Become a Pro Member!
- See forum categories - Enter the Forum
Moderators and Top Contributors
- Moderator List | Top Contributors:This Week, This Month, Aug, Jul, Archive, Top 100 All Time, Top Voted Members
Hot Threads This Week
