change width of css id style html tag...

[RIRedinPA]

how would I change the width of the table of a css id style?

 

I tried

 

document.getElementById('tableheader').table.style.width = "2000px"

 

but it didn't work.

[RichardRotterdam]

if that is in your head section try

windows.onload=function(){
  document.getElementById('tableheader').style.width = "2000px" ;
}

otherwise just

document.getElementById('tableheader').style.width = "2000px" ;

you had the .table.style the table thing did nothing

[RIRedinPA]

if that is in your head section try

windows.onload=function(){
  document.getElementById('tableheader').style.width = "2000px" 
}

 

No, I should have given more details, I'm making a scrollable table with fixed headers that has two views, art and editorial. The art view is 2000px wide, the editorial is 1500px. I have a toggle button which lets the viewers switch between views...here's my html set up:

 

<div id="tableheader">

<table cellpadding='3' cellspacing='0' border='0'> 
<tr>
<td>...stuff...</td>
<!--...more cells...-->
</tr>
</table>

</div>

<div id="etable" style="display: block;">
<table cellpadding='3' cellspacing='0' border='0'> 
<tr>
<td>...stuff...</td>
<!--...more cells...-->
</tr>
</table>

</div>

 

I set the width of the tableheader div initially in my styles:

 

#tableheader table {

width: 1500px;

}

 

I then need to change it in javascript depending on which view is toggled. Does that make sense?

 

[RichardRotterdam]

i think i get where the table got from now (.table.style)

you tried to set the width of the table inside table header or in css

to set the width like following

#tableheader table{width:100}

to put it very simple you want to change the table width is this correct?

 

[haku]

document.getElementById('tableheader').style.width = "2000px" 

[RIRedinPA]

@Dj

 

Yes, exactly...

[RIRedinPA]

document.getElementById('tableheader').style.width = "2000px" 

 

Reread my post. I know how to do that, but I am not sure how to edit the HTML tag <table> within just the tableheader id.

[haku]

Reread my post.

 

Re-write your post.

 

Are you not trying to change the width of a table that has the ID of #tableheader? Then you do it with the code I gave you. If you aren't trying to do that, then try explaining what you want, because your initial post didn't do it very well.

[RIRedinPA]

Reread my post.

 

Re-write your post.

 

Are you not trying to change the width of a table that has the ID of #tableheader? Then you do it with the code I gave you. If you aren't trying to do that, then try explaining what you want, because your initial post didn't do it very well.

 

Sorry, I was assuming you read all the post in the thread, I was referring to my reply to Dj and wasn't trying to be snide, my bad...I am trying to resize the width of a table within the div that has the id "tableheader"

 

#tableheader table {

width: 1500px;

}

 

I need to be able to toggle this to either 1500 or 2000px but I don't want to resize the div, just the table within.

 

[RichardRotterdam]

this is how to do it in plain js

//get the div with the table element in it
var tableContainer=document.getElementById('tableheader');

//get the child elements inside tableContainer
var tables=tableContainer.getElementsByTagName('table');
tables[0].style.width = "1000px";