[CSS3] horizontal/vertical-align ?

Are there any plans to 

a) fix 'vertical-align' property  
b) and to introduce something like 'horizontal-align' 
?

Consider this:

span 
{
   display: table-cell; /* or display:inline-block */
   vertical-align: bottom; /* ?????? */
}

It is not clear what vertical-align: bottom means here.

vertical-align  has completely different meanings 
in different  contexts.  In display:table-cell it means alignment 
of element's content and in inline context - alignment of the element 
itself.

I am considering this as a bug of specification.

In principle it has to be separate property like content-vertical-align
or vertical-align should accept two values: self-alignment and 
content-alignment.

There is also a need for horizontal-align with the meaning of 
content alignment.

Consider this:

div {  horizontal-align: right; overflow-x: hidden; }
div > p {  width: 200px; }

P elements inside the div should "stick" to right side of the div.
If content of the div overflows (e.g. its used width is less than 200 px)
then we should see right sides of  P elements. 
Currently all UAs exhibit  left alignment when content overflows
and there is simply no way to change this in CSS.
overflow-y/vertical-align should demonstrate the same behavior.

There are cases, e.g. while animating when such overflow/align 
beahvior is highly desirable. 

And yet, having it we can define in default CSS of HTML the 
following:

[dir="rtl"]
{
   direction: rtl;
   text-align: right;
   horizontal-align: right;
}
[dir="ltr"]
{
   direction: ltr;
   text-align: left;
   horizontal-align: left;
}


-- 
Andrew Fedoniouk

http://terrainformatica.com

Received on Thursday, 22 April 2010 06:47:04 UTC