CODEWITHSUNDEEP
htmlcsshtml-tableword-wrap
Vivek
Vivek

Reputation: 107

Dynamically expanding the width of a TD

Is there a way for expanding the width of a TD in the table based on the width of the next TD?

The asp:Panel is going to be hidden or displayed based on some condition in the code behind.

I'm thinking it's some CSS thing that would help me fix this, but unable to put a finger on it. Help!

Here's the HTML Markup:

<tr>
 <td class="content_body" style="width: 294px">
  This is some long text needs to be dynamically wrapped...............................................................
 </td>
 <td>
  <asp:Panel ID="Panel1" runat="server">
   This is going to be hidden based on some condition in the Code behind
  </asp:Panel>
 </td>
</tr>

Upvotes: 2

Views: 2947

Answers (2)

cdeszaq
cdeszaq

Reputation: 31280

One thing to try would be to leave the width off of the TD that needs to expand/shrink based on the other TDs. Without a width, a TD will by default take up any available space, so if the other TDs in the row all have a width specified, the one without a width will take up the rest of the space. If there are 2 such TDs, the space will be distributed between them.

Upvotes: 1

grenade
grenade

Reputation: 32179

With jQuery, you could apply an id to the top td in the two columns and then do something like:

$('#tda').width(($('#tdb').width() > 200) ? 10 : 100)

This sets the width of td with id tda to 10 if td with id b is greater than 200 else it will set it to 100.

Upvotes: 0

Related Questions