Merge Chromium + Blink git repositories
[chromium-blink-merge.git] / third_party / WebKit / LayoutTests / fast / css / vertical-align-baseline-rowspan-005.htm
blob67e49e270a30ae7082dc8474f441d72501359c3a
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2 <html>
3 <head>
4 <title>CSS Test: Vertical-align set to 'baseline' with a spanning cell</title>
5 <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
6 <link rel="author" title="WebKit" href="http://www.webkit.org/">
7 <link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#height-layout">
8 <meta name="flags" content="">
9 <meta name="assert" content="A spanning cell with Vertical-align set to 'baseline' aligns the cell's content baseline (which is the bottom of the first line of text or in-flow content) with the baseline of the first of the rows it spans.">
10 <style type="text/css">
13 vertical-align: top;
14 height: 50px;
16 #spanning
18 vertical-align: baseline;
20 #small
22 font-family: Ahem;
23 font-size: small;
25 #large
27 font-family: Ahem;
28 font-size: large;
30 </style>
31 </head>
32 <body>
33 <!-- The first cell in the row-span is the only one that has a baseline - the others are vertical-align:top.
34 Observing its baseline leads it to align the top of its text to the top of the text of the other two cells. -->
35 <p>Test passes if the top of the black boxes below is aligned.</p>
36 <table>
37 <tr>
38 <td>
39 <div id="large">Text</div>
40 </td>
41 <td id="spanning" rowspan="3" colspan="1">
42 <div id="small">Text</div>
43 </td>
44 <td>
45 <div id="large">Text</div>
46 </td>
47 </tr>
48 <tr>
49 <td></td>
50 <td></td>
51 </tr>
52 <tr>
53 <td></td>
54 <td></td>
55 </tr>
56 </table>
57 </body>
58 </html>