W3C home > Mailing lists > Public > www-style@w3.org > June 2005

Re: Proposal: content-vertical-alignment

From: Lachlan Hunt <lachlan.hunt@lachy.id.au>
Date: Fri, 10 Jun 2005 21:47:00 +1000
Message-ID: <42A97DB4.8090506@lachy.id.au>
To: Emrah BASKAYA <emrahbaskaya@hesido.com>
CC: "www-style@w3.org" <www-style@w3.org>

Emrah BASKAYA wrote:
> Proposal: A new property that will allow any content in a given element to
> be centered vertically:
> content-vertical-align

Just incase you, and anyone else, are unaware of this fact, vertical 
centering is already possible using at least 2 different methods that I 
know of (ignoring browser support issues).

The following examples work with this minimal HTML document, and center 
the p element both horizontally and vertically:
<html>
   <title>Vertical Center</title>
   <body>
     <p>test

Example 1:

html {
   display: table;
   height: 100%; width: 100%;
}
body {
   display: table-cell;
   vertical-align: middle;
}
p {
   border: 1px dotted red;
   width: 5em;
   margin: 0 auto;
}


Example 2:

p {
   border: 1px dotted red;
   position: absolute;
   height: 2.4em; width: 5em;
   top: 0; bottom: 0;
   left: 0; right: 0;
   margin: auto;
}

-- 
Lachlan Hunt
http://lachy.id.au/
Received on Friday, 10 June 2005 11:48:00 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:37 GMT