Featured post
css - Html table specify columns width in px does not work -
i'm trying make ajax columns-resizable table, interface works fine, when resize columnns, browser enlarges table @ max 100%, resizing other columns. i've tried both 2 solutions no 1 works well:
1.
min-width: 100%; table-layout: fixed; width: 100%;
with solution, need resize single column before going (if necessary) on 100%; if enlarge 1 column, example, others columns restricted, not maintain original width (as would)
2.
table-layout: fixed;
any ideas?
edit: relevant html code:
<table class="resizable" id="tabelladati" ><thead> <tr> <th id="mdt_thid"><span>id</span></th> <th id="mdt_thtext" style="width: 146px;">text</th> <th id="mdt_thtitle" style="width: 148px;">title</th> <th id="mdt_thcssclass" style="width: 83px;">cssclass</th> <th id="mdt_thurl" style="width: 92px;">url</th> <th id="mdt_thordine">ordine</th> </tr> </thead> <tbody> <tr> <td headers="mdt_thid">menualbo</td> <td headers="mdt_thtext">albo pretorio</td> <td headers="mdt_thtitle">albo pretorio</td> <td headers="mdt_thcssclass"></td> <td headers="mdt_thurl">/albopretorio</td> <td headers="mdt_thordine">2</td> </tr> </tbody></table>
and css:
#tabelladati { min-width: 100%; table-layout: fixed; width: 100%; } table { border-collapse: collapse; }
i answered question on setting column width css couple of days ago. may make sure set correctly first.how set table column width.. found needed set table width th/td. after table-layout: fixed should work alright.
edit:
so, missed had cell width set inline. loaded markup , css , looks great. (i'm using chrome)
then confused issue , realized ajax issue. i'm not hot ajax, i'm still checking out.
update:
there reason why must use ajax? is, benefit gaining using ajax instead of plain ol' javascript this:
var coltext = document.getelementbyid('mdt_thtext'); function setwidth(w) { coltext.style.width = w + "px"; }
i feel whole world easier, , stays formatted markup , styling have.
if adamant in using ajax, please provide code regarding ajax.
- Get link
- X
- Other Apps
Comments
Post a Comment