Table and TD Widths 2

[dcusick]

I am creating a webpage at work. The previous one I created I used absolute widths, to fit a 800x600 resolution. My boss didn't really like this because anyone with a larger resolution wouldn't get the full effect of the page. So for the site, I've decided to use percentages. I have the following Table layout...

_____________________________
| | |
| | |
| 200px | rest of the |
| wide | Page |
| | |
| | |
| | |
|_______|_____________________|

I have the layout done, I just can't get the width's correct. I'm using nested tables. How would I mix absolute width and percentage? I can do something like this...

<tr>
<td width=20%>blah</td>
<td width=80%>blah blah</td>
</tr>

But I want that left &quot;frame&quot; to be 200px no matter what size the screen is. If I do this...

<tr>
<td style=&quot;width: 200px&quot; width=&quot;200&quot;>blah</td>
<td width=*%>blah blah</td>
</tr>

The second column doesn't fill the entire screen. It just sits all the way to the right of the screen. Is there something I'm doing wrong? Any suggestions would be greatly appreciated.

Doug

 

[sumilsay]

set the table to 100% so whatever the screen size, it will fill it. then within the table, set the left cell to 200, and the other cell to 100% so it fills the rest of the screen.

<table width=&quot;100%&quot;>
<tr>
<td width=&quot;200&quot;></td>
<td width=&quot;100%&quot;></td>
</tr>
</table>

cheers!

 

[dcusick]

Thanks for the reply, but I did try that... It seems as if the initial absolute width is not accepted. When I do this, the 2nd column takes up as much room as possible. My 1st column will actually shrink, because the 2nd column is taking up all the extra space. I want the 1st column to be 200 pixels wide, no matter what...

 

[HellTel]

Don't specify a width for the second column, but do set your table width to 100%.

<table width=&quot;100%&quot;>
<tr>
<td width=&quot;200&quot;></td>
<td></td>
</tr>
</table> Hope I helped / Thanks for helping
if ((Math.abs(x)<10&&Math.abs<10) && (((parseInt(Math.abs(x).toString()+Math.abs.toString())-Math.abs(x)-Math.abs)%9)!=0)) {alert(&quot;I'm a monkey's uncle&quot;}

 

[dcusick]

That was it! Amazing that it's something that simple... Thanks a lot.

 

[HellTel]

I think it's more annoying when it was something simple, eh?
No probs, thanks for the star! Hope I helped / Thanks for helping
if ((Math.abs(x)<10&&Math.abs<10) && (((parseInt(Math.abs(x).toString()+Math.abs.toString())-Math.abs(x)-Math.abs)%9)!=0)) {alert(&quot;I'm a monkey's uncle&quot;}

 

[Julianne]

Another method is to ensure you have a graphic in the left column that's set to the column's width. You can use a transparent gif, sized at 200px wide x 1px high so it won't be noticed. That way, even if the second cell is set to 100% width the graphic forces the fixed width cell to remain open at the desired 200px.

If you don't want a graphic of any kind in your left content cell you can do a similar thing with a &quot;control row&quot;. Just create a new row under your main content cells and put a 200px-wide, 1px-high spacer in the left cell and a 1x1px spacer in the other cell, just to ensure it doesn't collapse.

The tutorial here is excellent:

http://www.dwfaq.com/tutorials/Tables/flexible_tables.asp

http://www.leevalleylions.co.uk

 

[dcusick]

Another excellent suggestion. Forgot how powerful transparent gifs actually were! A great tutorial site also. Thanks!