I've just created a site which tests perfectly in most browsers except IE6 which ruins the column widths. The third column is pushed below the middle column and I've tried numerous fixes to no avail. The site can be viewed at http://www.clearlygreendesign.com/endcruelty/index.html
The original CSS for the problem div is:
#content {
width:270px;
height:615px;
background:#6a5126;
float:right;
margin: 0 5px 0 5px;
padding: 18px 18px 18px 18px;
display: inline;
}
I've also tried adding a conditional comment to my page which can be viewed in the code (it doesn't show up properly in this forum post).
I've never done this before but it doesn't seem to be working. Does anyone have any ideas how to fix this problem? I'm ready to pull out my hair with this IE glitch!
Thanks so much!
Probably the doubled margin
Probably the doubled margin bug: add display: inline to the floated columns.
What is with that
What is with that browser?!
I did add display:inline to the last column. Do I need to add it to all 3 floated columns?
Thanks for the link!
If it works on the last one
If it works on the last one then that's all that's required.
Unfortunately it didn't work
Unfortunately it didn't work on the last one so I'm feeling kind of desperate. I've Googled this problem to death and can't seem to find a cure. Any other suggestions?
Well did you try it on the
Well did you try it on the others as well?
Yes, that worked!!! I've
Yes, that worked!!! I've just been given the thumbs up by IE6 users. Thanks SOOOO much for the help!!! :thumbsup: