Line Wrap Difference Between IE and Firefox - Building43 Blog

15
Jun
0

building43_comments

An interesting difference was detected on the Building 43 Blog between IE and Firefox.   I spent some time trying to figure out which of the two was the “correct” rendering based on their CSS.  The relevant code looks like this:

<td>

<div class=’js-singleCommentMenu’ style=’float: left;’>[More button]</div>

<div class=’js-singleCommentKarma’ style=’float: left;>

<span>Like this comment?</span>

<span style=’display: none;’>Score: 1 by 1 vote</span>

</div>

</td>

In javascript, the score span is changed to “display: inline” so that it appears.  What could be happening is that in Firefox, the script runs before the layout is complete, and firefox tries to float the div with both spans visible, forcing it to the next line.  In IE, the script doesnt change the display until after the first span is placed to the right of the More button because it fits, and then the Score text is added.   Any other theories on this bug?