Question

Technology: Visual Studio 2010, Asp.Net 4.0

I have several tables vertically aligned over each other. They are created dynamically in codebehind. I would like to make the first column the same width for each table based on the longest text from first column. there is know width set initially because the cell needs to resize dynamically to content.

Note: the first column(td) of each table row has a label.

So for example:

Table1 (first column)
1
12

Table2 (first column)
123
1234

The longest width would be the cell that contains [1234]. Now I would like to set the first column cells of the other tables to that width.

Here is a basic layout. FIDDLE
Of course this doesn’t show how it is created dynamically but the general jist of it.

Answer 1

You can iterate through td and use text() function to find the count of characters and filter out the td with maximum number of characters.

Live Demo

var maxlen=0;
var tdLongest;
$('table td').each(function(){
    if($(this).text().length > maxlen)
    {
        maxlen = $(this).text().length;
        tdLongest = $(this);
    }
});
alert(tdLongest.text());
alert(tdLongest.width());