IE6 floating problem causing wrapping


IE6 floating problem causing wrapping

Posted on Aug 11, 2009 by Paul White

There come a time when every developer plays an game of cat and mouse with CSS.  Its not so much the CSS but figuring out how to make it look the same in IE 6, as IE 7 and Firefox.  Well I came across one of these moments tonight.  Very interesting discovery.

For a particular website I had floated a bunch of  a tags.  The result was the last one kept going down to the next line.  I played with widths of the container Divs, and it didn't affect it.  Finally after reading countless blogs, and message board with people having the same problem, I came across a link that helped me discover the problem.  It turns out when IE6 reads HTML, all it wants to see is HTML.  If you throw any XHTML into the mix it won't be happy.

The code I had before that caused the problem looked like this

        <div id="banneractions">
<a rel="nofollow" href="/heating/" class="heating"/>
<a rel="nofollow" href="air_conditioning/" class="cooling"/>
<a rel="nofollow" href="/plumbing/" class="plumbing"/>
<a rel="nofollow" href="/kithen_remodeling/" class="kitchen"/>
<a rel="nofollow" href="/bathroom_remodeling/" class="bathroom"/>
</div>
What corrected the problem was to do this
        <div id="banneractions">
<a rel="nofollow" href="/heating/" class="heating"></a>
<a rel="nofollow" href="air_conditioning/" class="cooling"></a>
<a rel="nofollow" href="/plumbing/" class="plumbing"></a>
<a rel="nofollow" href="/kithen_remodeling/" class="kitchen"></a>
<a rel="nofollow" href="/bathroom_remodeling/" class="bathroom"></a>
</div>
I hope this helps others out that might have done something similar.
Permalink
1131 Visitors
2233 Views

Categories associated with IE6 floating problem causing wrapping

Discussion

No Comments have been submitted
name
Email Needed to confirm comment, but not made public.
Website
 
Type Code
Security Check
 
When you Post your Comment, you'll be sent a confirmation link. Once you click this link your thoughts will be made public.. Posts that are considered spam will be deleted, Please keep your thoughts and links relavent to this Article