Table-less Fixed-Width Version of an IRISM's WebZine Page

This entire page uses absolutely no tables at all for layout. It links to a modified version of the site's style sheet.

Using Fixed-Width Elements

A copy was made of the IRISM's WebZine page that used all <div> tags to define the elements. The percentages used in the original style sheet were multiplied to the total fixed width of 760px for this page, and those totals were applied to their elements' respective styles.

The height of each sidebar was calculated through the trial-and-error method.

Calculations

To calculate the width of each element, use the following formula:

desired width (pixels)
minus right margin width
minus right border width
minus right padding width
minus left padding width
minus left border width
minus left margin width
equals total width to use in your <div> layer.

Limitations

If you choose to enlarge your text size through your browser settings, the entire page display is completely messed up. If you choose to make your text size smaller, then the sidebars become longer than the text.

The only way to handle this and prevent the viewer from seeing weird results is to restrict your font size so that it can't scale.

However, this is horrendous, because it means you need to painstakingly hard-code the size of every page.