351 lines
19 KiB
HTML
351 lines
19 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
|
|
|
|
<!-- Work done for Netscape. License unknown. -->
|
|
|
|
<html lang="en-US">
|
|
<head>
|
|
<title>table-layout: fixed</title>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
|
|
<meta http-equiv="Content-Style-Type" content="text/css">
|
|
<link rel="copyright" href="/~dbaron/legal.html">
|
|
<style type="text/css">
|
|
|
|
table { table-layout: fixed; }
|
|
|
|
table td { border: thin solid; }
|
|
|
|
.full { width: 100%; }
|
|
|
|
.half { width: 50%; }
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<h1>table-layout: fixed</h1>
|
|
|
|
<p>The following tables should be laid out in the traditional manner
|
|
because their widths are <code>auto</code>:</p>
|
|
|
|
<table>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<p>All the columns in the following three tables should divide
|
|
equally the available space (100% of the width of the page):</p>
|
|
|
|
<table class="full">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="full">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="full">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<p>All the columns in the following three tables should divide
|
|
equally the available space (50% of the width of the page):</p>
|
|
|
|
<table class="half">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="half">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
|
|
<table class="half">
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
Lots and lots and lots of data. Lots and lots and lots of data.
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
<td>Data</td>
|
|
</tr>
|
|
</table>
|
|
|
|
|
|
<p>This test is still being written... </p>
|
|
|
|
<hr title="Beginning of Footer">
|
|
<p>(Back to
|
|
<a href="./">CSS Testing Information</a>,
|
|
<a href="../../">David Baron</a>)</p>
|
|
<p><a href="/~dbaron/" title="David Baron's Homepage">LDB</a>,
|
|
<a rev="made" href="mailto:dbaron@dbaron.org" TITLE="Send e-mail to David Baron">dbaron@dbaron.org</a></p>
|
|
|
|
</body></html>
|