PDA

View Full Version : Stupid ie6 float headache!



gregorywilliamd
Jul 23rd, 2010, 08:37 PM
I just made this little site and I can't figure out what is going on in ie6. I know it has something to do with the double margin bug, but I can't figure out what it is. I also tried applying display:inline to the div#sidebar and ol#content but nothing's working. Maybe someone can take a look at it here: http://pokercardrankings.com

Any help will be greatly appreciated! Thanks.

VIPStephan
Jul 23rd, 2010, 09:57 PM
I don’t have IE right now but a few things I noticed: your doctype declaration isn’t quite right. Don’t know if IE goes into quirks mode because of that (but it’s likely) but it must read <!DOCTYPE html … with the “html” in lowercase (at least with an XHTML doctype).

Then you know that IE6 can’t handle position: fixed, right? For IE6 you may wanna float that sidebar to the left (using the “star html hack” or conditional comments and a separate stylesheet). Also there is no need for a left margin on your right floated content since that content is floated right an has an explicit width already.

gregorywilliamd
Jul 23rd, 2010, 10:13 PM
Thanks, I changed the doctype.

As far as floating the content to the left, that messes everything up because of the position fixed I have on the left sidebar. I just thought it had something to do with the double margins that ie6 applies?

abduraooft
Jul 24th, 2010, 09:23 AM
Try
#sidebar {
float:left;
padding-bottom:0;
padding-left:0;
padding-right:0;
padding-top:30px;
position:fixed;
width:200px;
}
ol#content {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin-left:210px;
padding-bottom:80px;
padding-left:0;
padding-right:0;
padding-top:0;
}

And as said above IE6 doesn't support fixed position. Though you may fake it by some clever codes. Take a look at http://www.cssplay.co.uk/layouts/fixed.html

gregorywilliamd
Jul 24th, 2010, 06:19 PM
Ahhh... that simple solution seemed to work with the floats, thanks. I tried to fix the fixed position also from that link. I'm on a mac and I can't test in ie6 right now, anybody want to tell me if the fixed positioning works?

I'm not sure what's going on with ol#content li .example now too? It's shifting the first 6 "li" elements to the right. I've attached a screen shot.

8739