This page is archived from a static page – some links may not work
One of the new websites that I have been working on needs to be positioned in the centre of the visual area of the browser, this was a requirement of the client and something that is very easy to do using HTML version 3 by setting the height attributes in a table.
Height was removed in HTML 4 and these days I am beyond that anyway, tending to aim for XHTML compliance. (For example, this site should validate as XHTML, although because the php include files are written for server paths and not local machine paths Dreamweaver doesn’t realise it’s supposed to be following that version, usually leaving me with troubles in images and <br> tags.)
Two choices were available to me. The first and easiest was to use HTML 4 and get it working, but I chose to find out how to get around the missing height attribute.
Because the function of CSS is to produce the visual layout elements of a web page it was there that I found the answer. Height is still available so I set a class called outerShell and then called that in the table. A second table makes the actual content of the site.
.outerShell {
height : 100%;
width : 100%;
}
<table cellpadding="0" cellspacing="0"> <tr> <td align="center">Centred content here (in this case a second table) </td> </tr> </table>
It is highly likely that there is a better workaround for this, but it did work on Firefox and IE and it also validated, so the objectives were met
