[CSS21] Vertical align

Hi,
There are differences in how major browsers handle the 'vertical-
align' property. 
http://www.w3.org/TR/2003/WD-CSS21-20030915/visudet.html#propdef-
vertical-align

Compared to how 'vertical-align' applies to elements that are 
display: table-cell i failed to find an algorithm that specifies how 
to perform 'vertical-align' in an inline context.
http://www.w3.org/TR/2003/WD-CSS21-20030915/tables.html#height-layout

An example, assume the below fits on one row horizontally and that 
the image is higher than the current line-height:

    <img style="vertical-align: top" src="test.png" />Text <img 
style="vertical-align: bottom" src="test.png" />

What should be the result and why? If we switch the last to middle, 
how does that work (that works the same in all browsers, but i don't 
quite understand that it really fits how the CSS 2.1 model states it 
should work).

Another question:
http://www.w3.org/TR/2003/WD-CSS21-20030915/visudet.html#propdef-
vertical-align
"top
Align the top of the box with the top of the line box.
bottom
Align the bottom of the box with the bottom of the line box."

Why are they not relative to the parent like the other align 
properties?

A testcase:
    <span  style="vertical-align: top" ><img src="test.png" />in span 
</span>text<img src="test.png" />

It seems to me that only one browser makes the first image bleed 
upwards, which should be the correct way to render the above 
according to the rec i belive?

 /Staffan

Received on Tuesday, 7 October 2003 15:30:30 UTC