cell changes height although set to fixed height

[jualgi]

hey everyone.
i have a table with 3 columns, 2 rows. now i want the 2 outer colums of the 1st row to have a set height (for a colour-flow-background) and the outer colums of the 2nd row to automatically adjust to the content height of the middle column/cell.

here is the code:

<table width="100%" style="height: 100%;" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200" height="465" background="layout/bg.gif"></td>
    <td></td>
    <td width="200" height="465" background="layout/bg.gif"></td>
  </tr>
  <tr>
    <td width="200" bgcolor="#5D7B98"></td>
    <td></td>
    <td width="200" bgcolor="#5D7B98"></td>
  </tr>
</table>

so when i enter content of more than 465px in the middle column, i want the outer upper cells to remain at 465px and the outer lower cells to make up for the rest of the page. but what happens is that the cell that i set to 465 stretches in length and repeats its [1px x 465px] backgroundpicture (which then of course looks all messy).

any simple suggestions? i tried embedding another table into the cell - then i tried the background:repeat tag and some other stuff - unsuccessful.

please help! thx!

 

[Geodun1]

I think the issue lies in your height: 100%; setting for the tables overall style, but I'm not sure how that would affect the fixed height of an individual cell. Do you have an example page I can see?

EDIT: Also, try adding a div within the cell and putting the height/width settings on the div instead. See how that affects it.

 

[zkiller]

Could you give a example link please. Would make understanding your intent much easier.

Basically, the first problem that I see is that the center column can't have a different height than the outer columns. They are on the same row and must have the same height. The only way to avoid this is to span the center column across two rows, which would keep the top outer columns at the set height, regardless of how much content is entered in the center column.

<table width="100%" style="height: 100%;" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="200" height="465" background="layout/bg.gif"></td>
    <td rowspan="2">Content here.</td>
    <td width="200" height="465" background="layout/bg.gif"></td>
  </tr>
  <tr>
    <td width="200" bgcolor="#5D7B98"></td>
    <td width="200" bgcolor="#5D7B98"></td>
  </tr>
</table>

Hope that helps.

 

[jualgi]

hey again. thx for the reply!

@geodun: i have tried adding divs with heights to the cells before, but unfortunately that didnt help either...

@zkiller: i thought that would have fixed the problem, but if you exceed the content height of 200px in your code, the first row

<tr>
    <td width="200" height="465" background="layout/bg.gif"></td>
    <td></td>
    <td width="200" height="465" background="layout/bg.gif"></td>
  </tr>

will stretch and repeat its backgroundpicture, but the goal is to repeat the second row

<tr>
    <td width="200" bgcolor="#5D7B98"></td>
    <td width="200" bgcolor="#5D7B98"></td>
 </tr>

i tried modifying the table so that the content cell lies within the second row, but that is shown even worse like that:

<table width="100%" style="height: 100%;" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="43" height="200" background="layout/framelef.gif"></td>
    <td width="47" height="200" background="layout/framerig.gif"></td>
  </tr>
  <tr>
    <td width="43" background="layout/bglef.gif"></td>
    <td rowspan="2"></td>
    <td width="47" background="layout/bgrig.gif"></td>
  </tr>
</table>

anyway - it might be a bit messy, but have a look on www.team-schwimmen.de/try2.html. i have the problem with 4 cells there, as you might see its the wrong cell with its background repeating.
if you have a quicker and easier way to get the tablework done, so i can save it as a template and just work on the contentcell every time - i would send a turkey for thanksgiving

i just tried to make a huge table with 10 rows and columns and work from the inside outwards, but no chance. at least for me. so yeah - im still stuck

 

[jualgi]

hey guys. i found an easy solution. i just added another table in the cell. you then take a bg picture and set it for the table and then another bg picture for the cell. works great! thx anyway!

 

[tsm1248]

NO Tabels! ahh unless its for a chart then by all means go ahead

 

[zkiller]

I haven't used tables in ages, so I tested it to ensure I am not losing my mind. This works...

<table width="100%" height="100%"  border="0">
  <tr>
    <td width="200" height="465" bgcolor="#FF0000">&nbsp;</td>
    <td height="465" rowspan="2" valign="top">&nbsp;</td>
    <td width="200" height="465" bgcolor="#FF0000">&nbsp;</td>
  </tr>
  <tr>
    <td width="200" bgcolor="#00FFFF">&nbsp;</td>
    <td width="200" bgcolor="#00FFFF">&nbsp;</td>
  </tr>
</table>

Good luck!