Centered Tables
How do you get a layout to center from all directions? Or in any screen resolution? Well, it's a lot of tables coding, but enough to get you by. There's infinite ways to do this, so I'll try to keep it as basic as I can. However, this will require some CSS knowledge and maybe some clever thinking.
I will start off by making a table that is 100% the width of the screen and 100% the height, so it takes up the entire area of view:
I have taken off the border since nobody really wants to see it unless it's one of those layouts, but if you do want the layout to be visible, go ahead and change table border="0" to table border="1".
I will now center your layout by using valign (vertical alignments) and halign (horizontal alignments) to the end of your TD tag like so:
so now the entire code looks like so:
With valign=top this means that your layout will be aligned to the top of the page, but in the center of it horizontally, like you'd want it to be. If you want EVERYTHING in the absolute center, see the "centering frames" tutorial I've written in the HTML section. (or simply replace valign="top" with valign="center")
From here on out is a matter of building tables and adding in your content. This is just the basis of it being centered.
To help you in your efforts to make a centered layout, i've made a few various and generic templates for you to use. All you really have to do is adjust the widths and insert CSS, images, and your own text into them. Here they are:
Templates
x 3 Column template: Preview/Download
x 2 columns with navigation on left: Preview/Download
x 2 Columns with navigation on the right: Preview/Download
x 2 Columns with navigation on the left and footer: Preview/Download
x 3 Columns with footer: Preview/Download
x 2 Columns with navigation on the right and footer: Preview/Download
|