html - Making a td contract to only it's padding and content -
i've got table arranged this:
<table style="width:100%" class="ui-widget-content"> <tr> <td rowspan="2" style="width:100px;padding:10px"> </td> <td style="padding:5px"> </td> </tr> <tr> <td> </td> </tr> </table>
i want when filled content (sorry bad ascii art):
----------------------- | | | | |---------------| | | | | | | | | | -----------------------
however looks this:
----------------------- | | | | | | | | --------------| | | | | | | -----------------------
i did height:1% in top 1 doesn't work in ie, i'm looking less haxxy approach.
any advice?
edit:
here's actual code i'm using php left in:
<table style="width:100%" class="ui-widget-content"> <tr style="height:1px"> <td class="ui-widget-header" rowspan="2" style="width:100px;padding:10px"> <?= "<img src='/userpictures/$img.png' style='width:100%;height:100%'/>" ?> </td> <td class="ui-widget-header" style="padding:5px"> <?= $profiledetails['name']; ?> </td> </tr> <tr> <td> <?= stripslashes($wp['text']); ?> </td> </tr> </table>
you need set height
on tr
.
try this
table{ height:300px; border:1px solid red; border-collapse:collapse; } tr{ height:200px; border:1px solid red; border-collapse:collapse; } tr.top{ height:100px; border:1px solid red; border-collapse:collapse; } tr td{ border:1px solid red; border-collapse:collapse; }
example: http://jsfiddle.net/u3jyx/
Comments
Post a Comment