I recently created a new tabless css theme for my wordpress, and it looks fine on my firefox 2 and ie 7. However, My friend told me that it looked off (the content was way at the bottom) on his ie6. Can someone help me figure out what is wrong? Thanks! http://lily-white.org -the site. http://www.lily-white.org/wp-content/themes/sunkissed/style.css - the css
Don't have time to look through your code, but it's because of IE's broken box model. It would do a search for Broken Box Model and read about that. It's basically because IE 6 renders padding/margins different than other browsers do and your layout is basically broken because of this. Either your left or right column probably has a little to much padding/margin that's making it drop down below because there's not enough room side by side.
I did a research on it and I added the following code to my css: * html #world { width: 861px; w\idth: 831px;} Code (markup): It still didn't work. Also, this page (http://lily-white.org/5.php) seems to work fine on IE even though it uses the same css file. So would it still be the box model problem? Thanks!
Ok, I found this solution on a website and it seemed to work: Giving the floating content a negative margin equal to the total width of the content. #right { float: left; width: 566px; } * html #right{ display: inline; margin-right: -596px; } Code (markup): However, now there's a gap between the 2 floats. Is there a way to remove this?