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 w开发者_开发百科ithout 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
To centre everything within the body, use text-align:
style="text-align: center;"
To centre an element within its container, give it a width and use margin, like this:
style="width: 600px; margin: 0 auto;"
EDIT: as other people have suggested, you should use a stylesheet to keep everything tidy. Put the following in your <head>
(or reference a separate CSS file).
<style type="text/css">
body { text-align: center; }
</style>
<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).
Yes, the CSS tag you want is "text-align" not "align". Also, you should try and avoid inline styling, whenever possible use a stylesheet; it helps to keep all of your styling together in one place, and lets the browser cache the styling.
精彩评论