Pevná šírka bunky tabuľky

Veľa ľudí stále používa tabuľky na rozloženie ovládacích prvkov, údajov atď. - Jedným z príkladov je populárna mriežka jqGrid. Dochádza tu však k nejakej mágii, ktorú nedokážem pochopiť (sú to tabuľky, preboha, koľko mágie by tam mohlo byť?)

Ako je možné nastaviť šírku stĺpca tabuľky a nechať ju dodržiavať, ako to robí jqGrid? Ak sa to pokúsim zreplikovať, aj keď nastavím každej bunke <td style='width: 20px'>, akonáhle je obsah jednej z týchto buniek väčší ako 20px, bunka sa rozšíri!

Nejaké nápady alebo postrehy?

Riešenie

Mohli by ste skúsiť použiť tag `, ktorý spravuje štýl tabuľky pre všetky riadky, ale budete musieť nastaviť štýltable-layout:fixedna

alebo triedu css tabuľky a nastaviť štýloverflow` pre bunky

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/col

<table class="fixed">



    <tr>
        <td>text</td>
        <td>text</td>
        <td>text</td>
    </tr>
</table>

a toto je vaše CSS

table.fixed { table-layout:fixed; }
table.fixed td { overflow: hidden; }
Komentáre (6)
table td 
{
  table-layout:fixed;
  width:20px;
  overflow:hidden;
  word-wrap:break-word;
}
Komentáre (2)
table { 
    table-layout:fixed; width:200px;
}
table tr {
    height: 20px;
}

10x10

Komentáre (0)