Scalable reprise framework

Works pretty much as described in the introduction - however it uses no expressions.

The header and content div are given an ems width and positioned at left:50% while the left margin is set to minus half of its width. This gives us the centering.

The main content div is set to fill the entire viewport. The inner content div's width is the same as the header/footer's - auto values for the left and right margin suffices in modern browsers, IE has to do the text-align shimmy. Padding at the top and bottom allow the actual content to clear the header and footer.

However that's not quite the end of the story. The scrollbar on the content div means that the inner content div is just that much off-centre. On this page I've implemented a series of declarations that attempt to feed the right value to the right browsers. Of course, there is no right value really since it is possible for that value to be other than it is. This uses just the extremely lkely values.

Of course, if the layout was left aligned rather than centered, the scrollbar hacks would be unnecessary and it would just work, but I leave that as an exercise to you, dear reader.

Scalable reprise compatibility

Works in IE6, IE5.5, IE5.01, Firefox 0.8, Mozilla 1.6, Safari 1.1, Opera 7.5, Opera 7.23

Degrades acceptably in Mac IE5

Content is king

Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king.

Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king.

Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king.

Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king.

Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king. Content is king.

END CONTENT