Sun, 2003-12-21 04:58
I'm setting up a 3-column layout with CSS which was looking just great with IE 5.2, NS 7.1 and Safari on the Mac, and very weird with IE 5, 6 and NS 7 on Windows.
I have a "contents" div and then 3 columns nested, "leftcontent", "centercontent" and "rightcontent". On Windows, when I attempt to center the "content" DIV along with its children, the 3 children *begin* at the very center point of the page and proceed to the right. I've tried many things but the problem remains intractable.
Test Site: http://www.hyperarts.com/clients/test/
CSS: http://www.hyperarts.com/clients/test/_includes/style.css
Thanks for any help!
Tim
Sun, 2003-12-21 21:39
#1
Tableless layout w/nested DIVs Windows=wierd; Mac=fine
How are you trying to center it?
I'd add text-align:center to the element containing "content" (ie BODY) and then add margin-left:auto and margin-right:auto to "content". I think that works, did last time I cared to check anyway!
Wed, 2003-12-24 08:59
#2
Tableless layout w/nested DIVs Windows=wierd; Mac=fine
To fix the IE centering bug you added text-align: center; to the body tag.
Your problem is that you did not ever reverse it.
Add to the content div
text-align: left;
Regards
Day
Wed, 2003-12-24 16:00
#3
Tableless layout w/nested DIVs Windows=wierd; Mac=fine
Thanks for your help. The problem is now fixed:
http://www.hyperarts.com/clients/test3/
I ended up floating the 3 columns left and setting their left margins to 5, but adding the "text-align: center" to the <body> tag. I used that Tantek Box Model Hack to tame the independent-minded IE 5/5.5.
Thanks again to both of you for the guidance.
Have excellent holidays.
Tim