I'm having an issue of extra padding above and below inline text in span tag with IE6. It seems that the content edge of my box doesn't hug the contents as the text size shrinks below 18px. To see an example, go to:
<!-- m --><a class="postlink" href="http://www.joebaz.com/test.html">http://www.joebaz.com/test.html</a><!-- m -->
It works fine in Netscape 7, but IE is, of course, giving me a hassle. Any work arounds for this?
ThanksI believe it is because you didn't specify a line height. So IE uses it's default line height. Which isn't noticeable at 18px, but becomes noticeable with a smaller font.
<span style="background-color: Yellow; font-family: Verdana; font-size: 12px; line-height: 12px;">I've played with the line-height before, and it produced unpredictable results in both browsers. I did it for kicks in my test page (I matched the line-height with the font-size):
<!-- m --><a class="postlink" href="http://www.joebaz.com/test.html">http://www.joebaz.com/test.html</a><!-- m -->
<!-- m --><a class="postlink" href="http://www.joebaz.com/test.html">http://www.joebaz.com/test.html</a><!-- m -->
It works fine in Netscape 7, but IE is, of course, giving me a hassle. Any work arounds for this?
ThanksI believe it is because you didn't specify a line height. So IE uses it's default line height. Which isn't noticeable at 18px, but becomes noticeable with a smaller font.
<span style="background-color: Yellow; font-family: Verdana; font-size: 12px; line-height: 12px;">I've played with the line-height before, and it produced unpredictable results in both browsers. I did it for kicks in my test page (I matched the line-height with the font-size):
<!-- m --><a class="postlink" href="http://www.joebaz.com/test.html">http://www.joebaz.com/test.html</a><!-- m -->