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?
Mohli by ste skúsiť použiť tag <col>
, ktorý spravuje štýl tabuľky pre všetky riadky, ale budete musieť nastaviť štýl table-layout:fixed
na <table>
alebo triedu css tabuľky a nastaviť štýl overflow
pre bunky
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/col
<table class="fixed">
<col width="20px" />
<col width="30px" />
<col width="40px" />
<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; }
table {
table-layout:fixed; width:200px;
}
table tr {
height: 20px;
}
10x10