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

Popular posts from this blog

objective c - Change font of selected text in UITextView -

php - Accessing POST data in Facebook cavas app -

c# - Getting control value when switching a view as part of a multiview -