Is it possible to make a table so that width of cells is set:
1st cell - percentage width (e.g. 10% of the screen)
2nd cell - fixed width (e.g. 50px)
3d cell - remainder of the screen (I read it can be specified with a * or something like that)
| Alya wrote: |
Is it possible to make a table so that width of cells is set:
1st cell - percentage width (e.g. 10% of the screen)
2nd cell - fixed width (e.g. 50px)
3d cell - remainder of the screen (I read it can be specified with a * or something like that) |
<table cellspacing="0" cellpadding="0" border="0" width="100%"><tr>
<td align="left" width="10%"></td>
<td align="left" width="50"></td>
<td align="left" width="*%"></td>
</tr></table>
EDIT : ADDED *% by Marston . Thanks Marston .
Maybe this will work . Edit it to suit ur needs .
Even I made them align to left , there shud be no probs coz they occupy all the spaces .
Last edited by Summer on Wed Jan 04, 2006 10:26 am; edited 1 time in total
| Summer wrote: |
| Alya wrote: | Is it possible to make a table so that width of cells is set:
1st cell - percentage width (e.g. 10% of the screen)
2nd cell - fixed width (e.g. 50px)
3d cell - remainder of the screen (I read it can be specified with a * or something like that) |
<table cellspacing="0" cellpadding="0" border="0" width="100%"><tr>
<td align="left" width="10%"></td>
<td align="left" width="50"></td>
<td align="left" ></td>
</tr></table>
Maybe this will work . Edit it to suit ur needs .
Even I made them align to left , there shud be no probs coz they occupy all the spaces . |
Er, that last td wouldn't span the width of the cell. It should be:
| Code: |
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td align="left" width="10%">Content...</td>
<td align="left" width="50">Content...</td>
<td align="left" width="*%">Content...</td>
</tr>
</table> |
Note that the last cell's width is "*%" as opposed to being blank...
Or you could do it with a CSS table which can free flow to fit the space and have sections that are fixed.
Summer
Marston
Just tried it - doesn't seem to work.
The template is at http://www.best-software.frih.net/
In the second table:
When I set 3d cell to fixed width like 50px (instead of 5%) and last cell to *% (instead of 5%), the forth cell just gets stretched all the way to right edge of screen
GB
thanks, it's good to know there is another solution
Maybe you want a
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
at the beginning of your document.
See if it works
| Alya wrote: |
Summer
Marston
Just tried it - doesn't seem to work.
The template is at http://www.best-software.frih.net/
In the second table:
When I set 3d cell to fixed width like 50px (instead of 5%) and last cell to *% (instead of 5%), the forth cell just gets stretched all the way to right edge of screen
GB
thanks, it's good to know there is another solution |
You only asked for a table with three cells...
LukeakaDanish
Good point!
I made the changes.
but it didn't help with cell width issue
Marston
I tried to simplify the question using a more understandable example.
Is there any reason it would not work with 5 cells, but work with three?
Yes, there is. When you use the "*%" width attribute, that tells the browser to make that cell span the remaining width of the screen...
lol , if u set the 3rd cell to 50px and u want it to stay at its width , just add a 4th cell with *% .
Marston
yes, that's what I'd like to do!
I'd like the fifth cell to span the remaining width of the screen
Summer
the forth cell needs to be a percentage of the screen
I'd like the fifth cell to span the remaining width of the screen
| Alya wrote: |
Marston
yes, that's what I'd like to do!
I'd like the fifth cell to span the remaining width of the screen
Summer
the forth cell needs to be a percentage of the screen
I'd like the fifth cell to span the remaining width of the screen |
<table width=100%>
<tr>
<td width='10%'>CONT</td>
<td width='10%'>CONT</td>
<td width='50%'>CONT</td>
<td width='10%'>CONT</td>
<td>CONT</td>
</tr>
</table>
if the 5th cell has to span the remaining space,
just fill in nothing, but be sure you have defined the table width ...
otherwise that wont work.
you can also calculate the width of all cells
(in this example last cell has to be 20%)
i cant understand it!
someone can explained how it happened?
| studygroup wrote: |
i cant understand it!
someone can explained how it happened? |
just try it !!
copy and use,
<table border='1'>
and see what happens ....
we are not supposed to make a website for you ...
foumpie
what I'm trying to do is:
<table width=100%>
<tr>
<td width="5%">CONT</td>
<td width="15%">CONT</td>
<td width="50px">CONT</td>
<td width="70%">CONT</td>
<td width="*%">CONT</td>
</tr>
</table>
It does NOT work! The third cell (which is supposed to be a fixed length of 50 pixels) gets stretched to occupy the rest of the screen. The fifth cell (instead of occupying rest of the screen) gets totally collapsed to zero.
GB
I tried CSS. When I use absolute positioning with CSS, the design doesn't look good at higher screen resolutions. Everything becomes too close to upper left corner and the rest of screen looks empty.
What I like about setting table-cells as a percentage of screen width is that at higher resolutions things get re-positioned more evenly on the screen.
This worked absolutely fine for me (copied and pasted your exact code in a file, put <html> and <body> tags around it, and loaded it up). Maybe your browser is broken? What browser type and version are you using?