mirror of
https://github.com/mozilla/gecko-dev.git
synced 2024-11-01 14:45:29 +00:00
51 lines
1.6 KiB
HTML
51 lines
1.6 KiB
HTML
|
<!-- This test creates one table, one caption, three rows, three header cells, and five data cells.
|
||
|
|
The table uses the fixed table layout algorithm and the table's width specified to 600px.
|
||
|
|
Each column's width will be assigned as follows:
|
||
|
|
- 1st column: 200px (because it is defined in col element)
|
||
|
|
- 2nd column: 100px (because it is defined in first row)
|
||
|
|
- 3rd column: remaining width (becuase it is not defined so the remaining width is assigned)
|
||
|
|
The table and caption elements have border, margin, and padding.
|
||
|
|
The td and th elements have border and padding. -->
|
||
|
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Fixed Table with margin, border, and padding</title>
|
||
|
|
<style>
|
||
|
|
table {
|
||
|
|
table-layout: fixed;
|
||
|
|
width: 600px;
|
||
|
|
border: solid black 2px;
|
||
|
|
margin: 10px;
|
||
|
|
padding: 10px;
|
||
|
|
}
|
||
|
|
caption {
|
||
|
|
border: solid blue 1px;
|
||
|
|
margin: 5px;
|
||
|
|
padding: 5px;
|
||
|
|
}
|
||
|
|
td {
|
||
|
|
border: solid red 1px;
|
||
|
|
padding: 5px;
|
||
|
|
}
|
||
|
|
th {
|
||
|
|
border: solid red 1px;
|
||
|
|
padding: 5px;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<table>
|
||
|
|
<caption>This is a 3x3 fixed table with margin, border, and padding</caption>
|
||
|
|
<colgroup>
|
||
|
|
<col style="width: 200px" />
|
||
|
|
<col />
|
||
|
|
</colgroup>
|
||
|
|
<tbody>
|
||
|
|
<tr><th style="width: 100px">Header 1</th><td style="width: 100px">Cell 1</td><td>Cell 2</td></tr>
|
||
|
|
<tr><th>Header 2</th><td>Cell 3</td><td>Cell 4</td></tr>
|
||
|
|
<tr><th>Header 3</th><td>Cell 5</td></tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</body>
|
||
|
|
<html>
|