Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

Dotted underline on links in IE7



5:25 pm on Feb 16, 2011 (gmt 0)

5+ Year Member

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>

body.login .alt-action a {
margin:0 0 0 4px;
border-bottom:1px dotted;


4:47 am on Feb 17, 2011 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

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.

Featured Threads

Hot Threads This Week

Hot Threads This Month