Using dynamic and fixed sized tables

liunx

Guest
Hello I am just starting a new site and am trying to get the layout right, I will provide a link to it below.<br />
<br />
What I have done is make a table that is 3 cells wide, the first 2 cells I want to specify the width of them in pixels and the last (3rd) cell I just want to take the rest of the screen, so that way I can have the nice layout I am thinking of but it will also be dynamic for different screen res. Thanks for any help.<br />
<br />
<!-- m --><a class="postlink" href="http://www.marcusandmeagan.com/template">http://www.marcusandmeagan.com/template</a><!-- m --><!--content-->I havent looked at your site just yet but this is how you would do it:<br />
<br />
<table width="100%"><tr><td width="100px"></td><td width="150px"></td><td width="*" style="width:100%;"></td></tr></table><br />
<br />
Now the width="*" takes care of netscape but will cause problems in some versions of IE so that is why the style attribute is also applied as NS will not read it and IE will use it.<br />
<br />
-Matt<!--content-->I think all you need do is this:<br />
<br />
<table width="100%" border=1><br />
<tr><br />
<td width="100">test</td><br />
<td width="150">test</td><br />
<td>test<br />
</td><br />
</tr><br />
</table> <br />
<br />
I don't think width="100px" is a valid attribute<!--content-->Well that got me closer to the goal but with a new side affect, now the middle cell had disapeared, the code all looks correct I specified the middle cell to be 13 pixels but it is not showing at all.<br />
<br />
<!-- m --><a class="postlink" href="http://www.marcusandmeagan.com/template">http://www.marcusandmeagan.com/template</a><!-- m --><!--content-->Originally posted by kevin <br />
I think all you need do is this:<br />
<br />
<table width="100%" border=1><br />
<tr><br />
<td width="100">test</td><br />
<td width="150">test</td><br />
<td>test<br />
</td><br />
</tr><br />
</table> <br />
<br />
I don't think width="100px" is a valid attribute <br />
<br />
HTML 4.0 standards require the size attribute to have its measurement with the number, therefore 100px is correct, and 100 would no longer be valid.<!--content-->Originally posted by cli_man <br />
Well that got me closer to the goal but with a new side affect, now the middle cell had disapeared, the code all looks correct I specified the middle cell to be 13 pixels but it is not showing at all.<br />
<br />
<!-- m --><a class="postlink" href="http://www.marcusandmeagan.com/template">http://www.marcusandmeagan.com/template</a><!-- m --> <br />
<br />
here is what you should have:<br />
<br />
<tr><br />
<td background="rustsbar.gif" height="13" width="144">&nbsp;</td><br />
<td background="rustcorner.gif" width="13">&nbsp;</td><br />
<td background="vergrad.gif">&nbsp;</td><br />
</tr><br />
<br />
You need the &nbsp; command in each td that you have empty or else the 100% width will not show that td.<!--content-->That makes sense about needing the &nbsp; in there however as my luck would have it it didn't work, am I just doing my normal and just overlooking something very simple? I have probably built 100 tables and I don't have this much trouble, and on this simple of a table to boot.<!--content-->I just tried checking your site and the template folder no longer exists, may I ask where you moved it to?<!--content-->Sorry about that, when I uploaded the file I forgot to rename it to index.html and I have turned off directory browsing on my server, so I have fixed it now it is back at <br />
<!-- m --><a class="postlink" href="http://www.marcusandmeagan.com/template">http://www.marcusandmeagan.com/template</a><!-- m --><!--content--><tr><br />
<td background="rustver.gif" height="144" width="144">&nbsp;</td><br />
<td background="rustver.gif" width="13">&nbsp;</td><br />
<td background="rustver.gif" width="*" style="width:100%;">&nbsp;</td><br />
</tr> <br />
<br />
I believe that if you use 100% as the cell width in the last cell, your other cells will be crunched down as small as the content will allow, regardless of if you set the width to a fixed size. Since you other cells have no content, they will crunch down pretty small.<br />
<br />
Remove the width="*" style="width:100%;" from the one cell and see if your table displays like you want it to. If not, wait for more suggestions.<!--content-->oh yeah try this code:<br />
<br />
<tr> <br />
<td background="rustsbar.gif" height="13px" width="144px" nowrap="nowrap">&nbsp;</td> <br />
<td background="rustcorner.gif" width="13px" nowrap="nowrap">&nbsp;</td> <br />
<td background="vergrad.gif" width="*" style="width:100%;">&nbsp;</td> <br />
</tr><!--content-->ok why are you using a style in the cell?<br />
<br />
<td background="vergrad.gif" width="100%">&nbsp;</td><br />
<br />
it doesn't matter if the cell is 100% or not, it is empty and will be real small. and IE knows the width="100% as does NS (all versions)<br />
<br />
so setting a cell with nothing in it to 100% is not getting you any where. it will only be 2px wide, 5-10px with &nbsp;<!--content-->when using tables use spacer gifs (blank transparent gifs) to force the table the correct size no matter what the tables set 2<!--content-->
 
Back
Top