HTML5
Rozšířený model tabulek

Pokud vaše tabulky obsahují mnoho čísel, určitě uvítáte možnost úhledně zarovnávat čísla v sloupcích na desetinnou čárku. Jediným problémem je, že většina prohlížečů tuto užitečnou vlastnost zatím nepodporuje, ale co není, může být.

U atributu align, který můžeme používat u jednotlivých buněk, případně u skupin sloupců (colgroup) a sloupců (col), máme k dispozici hodnotu char. Pokud ji použijeme, můžeme pomocí dalšího atributu char vybrat znak, který bude v buňkách pod sebou lícovat. Pokud nastavíme tento znak na desetinnou čárku, budou čísla vyrovnána pod sebou tak, jak jsme na to zvyklí. Malá ukázka:

<table border="1">
<caption>Přehled průměrných cen vybraného ovoce</caption>
<colgroup span="1">
<colgroup span="1" align="char" char=",">
<thead>
<tr><th>Ovoce</th>		<th>Cena v Kč</th></tr>
</thead>
<tbody>
<tr><td>Jablka</td>		<td>25,30</td></tr>
<tr><td>Hroznové víno</td>	<td>46</td></tr>
<tr><td>Banány</td>		<td>23,90</td></tr>
<tr><td>Jahody</td>		<td>46,20</td></tr>
<tr><td>Bílý meloun</td>	<td>151,80</td></tr>
</tbody>
</table>

Vidíme, že čísla jsou zarovnána přehledně pod sebou podle desetinné čárky. Pomocí atributu char můžeme určit libovolný znak, jehož první výskyt bude ve všech buňkách sloupce vždy pod sebou. Pokud nějaká buňka daný znak neobsahuje, zarovná se vpravo k místu, kde je v ostatních buňkách znak určený pomocí char.

Pozici znaku pro zarovnání v buňce můžeme ovlivňovat pomocí atributu charoff. Jako hodnota atributu se uvádí vzdálenost znaku od levého okraje buňky. Může použít buď pixely nebo procento. Pokud tedy chceme, aby desetinná čárka byla uprostřed sloupce, použijeme něco jako:

align="char" char="," charoff="50%"

Všechny atributy řídící způsob zarovnání (včetně align a valign) můžeme použít u následujících elementů: td, th, col, colgroup, tr, thead, tfoot a tbody. Elementy uvedené v tomto výčtu dříve mají větší váhu. Nastavení způsobu zarovnání u nich překryje nastavení provedené u jiného elementu.