Vertical Centering with a Shiv Div is a post on The Hickensian

Matthew Tretter has solved the perennial problem with the current vertical centering technique – loss of content vertically when the window is too small, without even scrollbars to see that lost content. His simple solution is the addition of a floated ‘shiv div’ that sits at the top, pushing the main content area down, but then collapses when the content arrives at the top of the screen.

This shiv div could also serve other purposes, such as container for skip links, although the addition of a simple little div doesn’t cause me any sleepless nights.

Before I leave the subject of vertical centering, a wee tip. Instead of making the negative margin exactly half the height of the main content, give it 10px more. Its a picture framing trick, as centering it exactly can make it feel as if it’s ‘falling off the page’.

I’m going to implement this genius fix as soon as I can, although the semi-fluid design I desire ( I don’t intend the site to be stuck at 900px wide) still eludes me.