W3C home > Mailing lists > Public > www-style@w3.org > July 2003

Re: Center DIV

From: Simon Jessey <simon@jessey.net>
Date: Thu, 3 Jul 2003 12:18:38 -0400
Message-ID: <003001c3417e$c31fed00$6601a8c0@Simon2S0JP11>
To: <www-style@w3.org>

----- Original Message ----- 
From: "Chris Moschini" <Chris.Moschini@amdocs.com>
Subject: RE: Center DIV

> Why must centering relative to the viewport be so obscure?

A web document, in the visual sense, is supposed to be regarded as
continuous visual media. As such, the concept of a vertical center really
doesn't work in the way you would instinctively think. CSS-P does provide a
mechanism for orienting elements with respect to the viewport in the rule
position:fixed, but many of the current visual user agents (especially
Internet Explorer) lack proper support. This is not a fault of the CSS
specification, it is a fault of the browser vendors.

With paged media, however, the phyiscal dimensions of the viewport (paper)
are known, so manipulating the position of elements is much easier.

I use the following declaration block for centering a div:-

div {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 10em;
    height: 10em;
    margin-top: -5em;
    margin-left: -5em;

The only drawback is that the height and width must be explicitly declared
in relation to the top and left margins.

Simon Jessey

w: http://jessey.net/blog/
e: simon@jessey.net
Received on Thursday, 3 July 2003 12:18:38 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:27:08 UTC