How to resize table columns width from JavaScript

javascript css column-width
Stavros picture Stavros · Apr 30, 2009 · Viewed 11.7k times · Source

I have a problem with javascript.
I have a list of table cells stored at TabList.
I want to find the maximum width, and then set this width to all of them.
A sample code is here, but the setting of the width is not working.

var MaxTabWidth = 0;
for (var i = 0; i < TabList.length-1; i++)
{
  if (TabList[i].offsetWidth>MaxTabWidth) 
    MaxTabWidth = TabList[i].offsetWidth;
}

for (var i = 0; i < TabList.length-1; i++)
{
  TabList[i].style.width = MaxTabWidth+"px";
  // TabList[i].width = MaxTabWidth+"px";
  // TabList[i].offsetWidth = MaxTabWidth+"px";
}

I have commented my attempts..
Any help?
This didn't do the trick for me..

update:
I am sure TabList is a list of Cells because I was checking the className.
I am looping until TabList.length-1, because I want the last cell to fill the rest of the table's width.

Answer

airportyh picture airportyh · May 1, 2009

I would suggest you remove all css/styling from the page and testing it to isolate the problem. Things like this are often complicated by css.

Related questions

How do I add a class to a given element?

I have an element that already has a class: <div class="someclass"> <img ... id="image1" name="image1" /> </div> Now I want to create a JavaScript function that will add a class to the div (…

Read More
Retrieve the position (X,Y) of an HTML element relative to the browser window

I want to know how to get the X and Y position of HTML elements such as img and div in JavaScript relative to the browser window.

Read More
Set cookie and get cookie with JavaScript

I'm trying to set a cookie depending on which CSS file I choose in my HTML. I have a form with a list of options, and different CSS files as values. When I choose a file, it should be saved …

Read More