.sub   {vertical-align: sub ; color: red}
      .super {vertical-align: super ; color: red}

      .percent50  {vertical-align: 50% ; color: green}
      .bigfont    {font-size: 1cm}

      .drop1cm    {vertical-align: -1cm ; color: blue}
      .raise1cm   {vertical-align: 1cm ; color: blue}
    

Smoke test: This paragraph contains superscript and subscript text. The subscript text in the previous sentence should cause the following line to shift down a little to make room. Fill this paragraph up with text so that this is more obvious. Fill this paragraph up with text so that this is more obvious. Fill this paragraph up with text so that this is more obvious.


Test for percentage values of vertical-align. Both the green elements in this paragraph have a vertical-align of 50%. But one element occurs in a taller line box than the other. Is the 50% based on the actual height of the line-box?

A similar test to the previous. What if the text with the vertical align is itself rendered in a really big font? Again, put some filler text in this paragraph to make the effects easier to observe. Again, put some filler text in this paragraph to make the effects easier to observe. Again, put some filler text in this paragraph to make the effects easier to observe. Again, put some filler text in this paragraph to make the effects easier to observe.

According to Mozilla and Konqueror, percentage values for vertical align are calculated relative to the line-height of the inline element itself. Opera calculates relative to the line-height of the parent block. It seems to me M and K have it right.


When text is dropped or raised, the size of the line box should be increased so that the lines do not bleed into each other. I first noticed this problem with dropped text. xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx xx