table-layout: ***;
Browser |
|
---|
The table-layout property specifies the algorithm used to render a fixed-width table.
This property can apply to the TABLE element.
table {
width: 300px;
table-layout: fixed;
}
Property | Value | Explanation |
---|---|---|
table-layout | auto | automatic table layout (default) the layout is decided after all rows are processed |
fixed | fixed table layout the layout is decided after the first row is processed (rendering is faster than the automatic layout) |
If you specify the "fixed" value for this property, the width must be specified for the TABLE element. (If necessary, specify the width of the cells at the same time.)
Example
<html>
<head>
<title>TAG index</title>
<style type="text/css">
table {
border: 2px #2b2b2b solid;
width: 250px;
table-layout: fixed;
}
td, th {
border: 2px #2b2b2b solid;
width: 50%;
}
</style>
</head>
<body>
<table>
<tr>
<th>Heading A</th>
<th>Heading B</th>
</tr>
<tr>
<td>Cell A</td>
<td>Cell B</td>
</tr>
</table>
</body>
</html>
- Output
-
Heading A Heading B Cell A Cell B