Definition
A simple object for manipulating the structure of HTML `table`s.
o-table
Lorem ipsum | Lorem |
---|---|
Dolor sit amet | Ipsum |
Consecteur | Elit |
<table class="o-table">
<tr>
<th>Lorem ipsum</th>
<th>Lorem</th>
</tr>
<tr>
<td>Dolor sit amet</td>
<td>Ipsum</td>
</tr>
<tr>
<td>Consecteur elit</td>
<td>Dolor</td>
</tr>
</table>
Alignment modifiers
The table fixed modifier forces all cells within a table to occupy the same width as each other. This also has performance benefits: because the browser does not need to (re)calculate cell dimensions based on content it discovers, the table can be rendered very quickly.
o-table > o-table--fixed
Lorem ipsum | Lorem |
---|---|
Dolor sit amet | Ipsum |
Consecteur | Elit |
<table class="o-table o-table--fixed">
<tr>
<th>Lorem ipsum</th>
<th>Lorem</th>
</tr>
<tr>
<td>Dolor sit amet</td>
<td>Ipsum</td>
</tr>
<tr>
<td>Consecteur elit</td>
<td>Dolor</td>
</tr>
</table>