Vertical alignment of inline tables

The three most popular Web browsers

Firefox (tested 2.0.0.8)
Internet Explorer (tested 6.0.2800 and 7)
Opera (tested 9.50 Beta 2)

are very challenged by the CSS vertical-align property when applied to tables whose CSS display property is inline.

For not one of the possible values of vertical-align do all three agree, and none of the browsers does very well when compared with the very mature, very public standard.

See CSS 1 standard on vertical-align.

Safari (to 3.0.4) does not accept the challenge: it doesn't inline tables at all.

There are a couple of issues that are unfortunately left up to interpretation. The browsers, unsurprisingly, do silly things in these cases.

What is the baseline of a table? I would think, it was the baseline of the text in the last row of the table (the lowest baseline among the columns of the last row, if they differ). Sometimes however, it is interpreted as the bottom of the table's bounding box, and sometimes as the baseline of the table's first row.
What does superscripting and subscripting mean, when applied to a table? There are very different obvious interpretations. This is so unclear, I doubt the usefulness of sub and super as applied to tables

Note: specifying the border of the table (either with CSS or with the table attribute) has a pathological effect in both Firefox and Opera (but IE gets it right)

standard example conformance

unspecified vertical-align

By default, value should be baseline

baseline

FF: bottom of table is on baseline. Consistent with baseline

IE: like FF

Opera: middle of table is on baseline. Inconsistent with baseline.

vertical-align: baseline

Align the baseline (or bottom, if there is none), with enclosing baseline.

baseline

FF: puts the bottom of the table on the baseline

IE: like FF

Opera: acts as if the baseline of the table were that of its top row.

vertical-align: top

Align top of the table with top of highest item in enclosing line.

baseline

FF: wrong (looks like default)

IE: right

Opera: right

vertical-align: bottom

Align bottom of table with bottom of lowest item in enclosing line.

baseline

FF: right

IE: wrong: instead puts the bottom of the top row of the table on the bottom.

Opera: like IE.

vertical-align: middle

Place middle of table at half the enclosing font's x-height above baseline.

baseline

FF: completely wrong (looks like default)

IE: right

Opera: is off. middle is on the baseline

vertical-align: text-top

Place top of table at the top of enclosing line's text.

baseline

FF: completely wrong (looks like default)

IE: right

Opera: is high, in a way I don't understand

vertical-align: text-bottom

Place bottom of table at the bottom of enclosing line's text.

baseline

FF: right

IE: right

Opera: wrong (looks like default)

vertical-align: super

Standard unclear on what this should do.

baseline

FF: just looks like the default again.

IE: puts the bottom row of the table where a superscript would be

Opera: looks like it raises the table (from default middle position) by the amount of a subscript

vertical-align: sub

Standard unclear on what this should do.

baseline

FF: The baseline of the bottom element is lower than the text baseline

IE: puts the top of the table where the top of a subscript would be

Opera: like IE

vertical-align: -100%

Move the table down by one line-height

baseline

FF: puts the middle of the table on the baseline. Consistent with baseline

IE: like FF

Opera moves it the right amount, but since it started out with the table's middle on the baseline, the effect is quite wrong.