Unfortunately, CSS2 doesn't have a property to vertically center stuff. You might think vertical-align might do it, but it only works for table cells and and inline elements. What you might think you could do instead, is to make the parent element act like a table cell (display: table-cell;) and vertically center it (vertical-align: center;). But it's not really that simple. If you want it to work in IE6 and IE7 without using tables, then you have to use CSS hacks. As far as I know, it's impossible to vertically align most elements without using invalid CSS or tables.
Using the HTML height attribute on a table is not allowed when following the doctype, and that's why your example doesn't work when you add the doctype. There is a workaround though, and the basis of it involves using the CSS height property on your table instead of the HTML attribute.
To center your page with valid CSS and tables: http://apptools.com/examples/tableheight.php
To center your page with CSS hacks and no tables:
http://www.jakpsatweb.cz/css/css-ver...-solution.html
__________________
The interlocking pieces of web development: usability, performance, accessibility, and standards.
|