Comments on: IE formatting oddity http://www.svendtofte.com/stylesheets/ie-formatting-oddity/ rantings & scraps on code and web development Mon, 01 Dec 2008 20:18:51 +0000 http://wordpress.org/?v=2.6 By: svendtofte http://www.svendtofte.com/stylesheets/ie-formatting-oddity/#comment-5 svendtofte Wed, 09 Jul 2008 21:04:12 +0000 http://www.svendtofte.com/?p=9#comment-5 Hmm, yeah, you're right. I guess the behavior is related to collapsing whitespace across tags. Since the trailing whitespace behind the <code>small</code> tag gets collapsed, and it exists outside the tag, it gets the "normal" font-size. If trailing whitespace exists inside the tag (making it "small" font-size whitespace), all the trailign whitespace behind the second tag gets collapsed, and thus doesn't affect the line-height. It's not really related to small tags alone, you can see the same thing happening here. <pre>.wth { font-size:50%; background-color:green; margin-top:0;} ... <h2>foo</h2> <span class="wth"> b az</span> <h2>foo</h2> <span class="wth"> b az </span></pre> And no, I'm not really bothered, but it is interesting to observe. Hmm, yeah, you’re right. I guess the behavior is related to collapsing whitespace across tags. Since the trailing whitespace behind the small tag gets collapsed, and it exists outside the tag, it gets the “normal” font-size. If trailing whitespace exists inside the tag (making it “small” font-size whitespace), all the trailign whitespace behind the second tag gets collapsed, and thus doesn’t affect the line-height.

It’s not really related to small tags alone, you can see the same thing happening here.

.wth {
font-size:50%;
background-color:green;
margin-top:0;}
...
<h2>foo</h2>    <span class="wth"> b az</span>
<h2>foo</h2>    <span class="wth"> b az </span>

And no, I’m not really bothered, but it is interesting to observe.

]]> By: Corey Docken http://www.svendtofte.com/stylesheets/ie-formatting-oddity/#comment-4 Corey Docken Wed, 09 Jul 2008 19:17:10 +0000 http://www.svendtofte.com/?p=9#comment-4 I stumbled across your site looking at a post you wrote about expressions in CSS and I went to the main page and noticed this post. I figured out what is going on here... If you drag your mouse after the second "b az" text (the one you are having issues with), you'll notice that Internet Explorer adds a space before taking advantage of the line break you have. If you were to put the hr tag directly after closing your second small tag (no spaces or line breaks), the problem should go away. You don't seem to be too worked up about it, but I thought I'd just mention my thoughts on this subject. I stumbled across your site looking at a post you wrote about expressions in CSS and I went to the main page and noticed this post. I figured out what is going on here… If you drag your mouse after the second “b az” text (the one you are having issues with), you’ll notice that Internet Explorer adds a space before taking advantage of the line break you have. If you were to put the hr tag directly after closing your second small tag (no spaces or line breaks), the problem should go away.

You don’t seem to be too worked up about it, but I thought I’d just mention my thoughts on this subject.

]]>