Při řešení zobrazení běžných údajů v buňce HTML tabulky, občas je potřeba ošetřit, aby se tato (tabulka, potažmo buňka) neroztahovala do "aleluja", obzvlášť, pokud údaje do ní zadává uživatel. Jak to celé ošteřit?
Řešení je poměrně jednoduché - pomocí CSS, funguje v IE(7,8), FF3.6, O10, CH7, a bylo zveřejněno již v roce 2007:
table {
table-layout:fixed;
width:100%; /* nebo definovat jinou pevnou šířku */
overflow:hidden;
word-wrap:break-word;
}
Příklad: převzato z: Jak předcházet přílíš dlouhému roztahování tabůlky (anglicky, "How to prevent HTML tables from becoming too wide", http://www.456bereastreet.com/lab/table-layout-fixed/example-4.html)
# |
název |
sloupec2 |
sloupec3 |
1. |
zkouška zalomení řádku |
_________________________________________________________________________________________________________________________________________________šsčdřdždfasýdfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkheeeeeeeeeeeeeeeeeeeeeeeeeeeerfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrelktghyjž |
a |
2. |
zkouška zalomení řádku |
šsčdřdždfasýdfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjggggggggkhrfáasdfáasí_éasdfasdfasddfasýdfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrfáasdfáasí_éasdfasdfasdf-kajsdfoirtjkhrelktghyjž |
a |