Search code examples
htmlcsstagsalignment

Center tag works fine, but align attribute doesn't! What may be the issue?

I am trying to align a complete page, to the center of a frame, and if I use center tag, it works fine. But, if I use

<body align=center>

or

<body style="align:center">

it doesn't align the page, but keep it left-aligned as default. Now, I am a newbie at HTML to be honest, so I don't have much idea, what may be causing this. Also, this happens only in non-IE browsers. IE shows the page center aligned, even without any tags.

Although, it is not of much significance, as I can always use center tag, but its nice to know why align attribute doesn't work. Kindly let me know, if anyone got any idea, as to what is the problem.

Edit:

Turns out, it is because of quirks mode. Thanks David and Town! :D

Solution

  • <body align=center>

    Don't use this. The align attribute is deprecated.

    <body style="align:center">

    CSS is the preferred method but:

    • Inline style (the use of the style attribute) should be avoided in favour of real stylesheets.
    • There is no align property in CSS

    Use the text-align property if you want to centre the inline content of the element to which you apply it or set the left and right margins to auto to centre block elements. For more details, and diagrams, see Centring using CSS.

    Also, this happens only in non-IE browsers. IE shows the page center aligned, even without any tags.

    If you don't have a Doctype that triggers Standards mode, then browsers will emulate bugs in earlier browsers (Quirks mode). This is something you should avoid as it makes things much less consistent.

    One of these bugs is that Internet Explorer will centre block elements if an ancestor has text-align: center set (and won't support auto margins).