1
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01//EN">
4 <title>CSS
2.1 Test Suite: vertical-align
</title>
5 <script src=
"../resources/ahem.js"></script>
6 <style type=
"text/css">
7 .test {font: 15px/1 Ahem
; color: green
; background: red url
(support/css1test544b.png) no-repeat
; width: 90px; margin: 0 1em;}
10 .three {vertical-align: top
; font-size: 15px;}
11 .four {vertical-align: text-top
; font-size: 15px;}
12 .five {vertical-align: middle
; font-size: 15px;}
13 .six {vertical-align: bottom
; font-size: 15px;}
14 .seven {vertical-align: text-bottom
; font-size: 15px;}
15 .eight {vertical-align: baseline
; font-size: 15px;}
16 .nine {vertical-align: 50%; font-size: 15px; line-height: 20px;}
18 <link rel=
"help" href=
"http://www.w3.org/TR/CSS21/visudet.html#q26" title=
"10.8.1 Leading and half-leading">
21 <p>There should be a green block with no red below.
</p>
23 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"three">X
</span>X
</div>
24 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"big"><span class=
"four">X
</span>X
</span></div>
25 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png" class=
"five">X
</div>
26 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"big"><span class=
"six">X
</span>X
</span></div>
27 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"big"><span class=
"seven">X
</span>X
</span></div>
28 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"big"><span class=
"eight">X
</span>X
</span></div>
29 <div><img alt=
"FAIL: Image support required." src=
"support/swatch-green.png"><span class=
"nine">X
</span>X
</div>