Forum Moderators: open

Message Too Old, No Replies

XHTML centering browser incompatibility problems

         

WipMaster

11:32 am on Apr 22, 2004 (gmt 0)

10+ Year Member



I have Xhtml stric page :

body {
text-align: center;
}

this works with IE but the Netscape and Mozilla not centering the body

PLs help!

choster

12:45 pm on Apr 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Technically, Mozilla has it correct. The text-align style is intended for inline elements, like your body text. It should not affect the placement of the container blocks for that content (divs, tables, paragraphs, etc.).

Setting "margin: 0 auto" on those block elements will center them correctly in standards-compliant browsers (the "0" sets the top and bottom margins, the "auto" sets the left and right margins).

IE does not understand margin:auto, so even though its usage is not W3C-compliant you'll need to keep the text-align:center on <body>. Additionally, IE has the annoying habit of applying the centering to the text in addition to the blocks, so you'll need to apply an additional text-align on the inline content if you want to change it to left-aligned again.

So if your styles were all inline, your markup might be

[...]
<body style="text-align:center">
<div style="margin:0 auto; text-align:left; width:80%; background:#ffc;>
<h1>Title</h1>
<p>Your content here.</p>
[...]
</div>
</body>
[...]

ergophobe

2:01 pm on Apr 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



By the way Wipmaster, there's a whole forum devoted to CSS. Especially for more difficult questions, that's the place to go because there are some CSS wizzes who seem to read (or at least post) almost exclusivly over there.

ergophobe

2:01 pm on Apr 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I just noticed your post total - Welcome to WebmasterWorld!