Re: Proposal: content-vertical-alignment

Lachlan Hunt wrote:
> 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).
> 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;
> }

This requires TWO wrapping elements to center one element. No good.

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

This takes the centered element out of the flow. The proposed 
properties allow using *excess* space to center the content but 
allow the content to be kept in flow. This allows centered content 
to push the remaining content away in case the centered content is 
"too large" to fit the space.

The thing is, vertical align is *already* supported inside a table. 
The table method requires at least two wrapper elements for no good 
reason. At least change the spec so that vertical-align property 
applies to all block level content (including inline-block).

-- 
Mikko

Received on Friday, 10 June 2005 14:00:29 UTC