27 28 29 30
z10 z11 z12 z13 z14 z15 z16 z17 z18 z19 z20 z10 z11 z12 z13 z14 z15 z16 z17 z18 z19 z20 z10 z11 z12 z13 z14 z15 z16 z17 z18 z19 z20 z10 z11 z12 z13 z14 z15 z16 z17 z18 z19 z20
Verdana
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
Arial
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
Times New Roman
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
Georgia
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
Courier New
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
Trebuchet MS
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x
x

An image (red rectangle) with vertical-align: middle is the only content of a box (black background), so the box has always the height of the image (transitional doctype, not relevant for IE7-). In IE5.5-7/Win the image is sometimes positioned one pixel too low, leaving a 1 pixel black row at the top. The last 1 pixel row of the image protrudes out of the container if the image has position:relative, otherwise it is cropped.

This behavior occurs only with some combinations of image height, font-family and font-size. Line-height is not relevant, as well as hasLayout and position:relative on the container.

The combinations having the 1px bottom shift are the ones where the image height and the “default line-height” have different parity. The “default line-height” is the height of a line box containing only text and having no specified line-height; it depends on font-family and font-size (normally it is about 1.2 times the font-size.)

In the above table of test cases:

A javascript function adds for each test case: the computed image shift (0 or 1), the “default line-height” in effect, the container height, and possibly a red ‘E’ indicating that the above assumption about the presence of image vertical shift is not verified. Of course this ‘E’ shows up in non-IE browsers (and IE8) that do not have the shift problem.

CSS tests home