table height

[gagz]

I'd think this would be simple and easy to do, and a needed functionality.

I want to be able to do this:

<!-- header -->
<table>
<tr>
<td><img src=someimg.jpg></td>
<td>some text, etc</td>
</tr>
</table>
<!-- end header -->
<!-- variable sized body of page -->
<table height=100% (or * or SOMETHING!)>
<tr>
<td>stuff here</td>
</tr>
</table>
<!-- end body -->
<!-- trailer -->
<table>
<tr>
<td><img src=someimg.jpg></td>
<td>some text, etc</td>
</tr>
</table>
<!-- end trailer -->

basically, without using frames, i want the trailer to end up aligned to the bottom of the page and the header at the top. Soooo, the "body" table would have to be 100% of the remainder of the space. I think i saw that Height is not supported under html 4, and I've tried stuff with divs, but NOTHING has worked. I have to believe there is a way to do this... any ideas? anyone?

--(deparate) gagz

 

[LV]

You can probably do it using just one table:

<table height=&quot;100%&quot;>
 <tr height=&quot;60px&quot;> <!-- start header -->
    <td><img src=&quot;someimg.jpg&quot;></td>
    <td>some text, etc</td>
 </tr>              <!-- end header -->
 <tr>               <!-- start content -->
     <td colspan=2 valign=top>stuff here</td>   
 </tr>              <!-- end content -->
 <tr height=&quot;50px&quot;> <!-- start footer -->
     <td colspan=2><img src=&quot;someimg.jpg&quot;></td>
 </tr>              <!-- end footer -->
</table>

 

[gagz]

thast still wouldn't force the trailer to align at the end of the page

 

[gagz]

well, what i meant was height=100% doesn't work, see original post.

 

[Vragabond]

LV's solution works for me in Mozilla 1.4, IE6 and Opera 7.22. I wouldn't imagine what more you would need.

 

[LV]

Maybe changing the height of header & footer to % will help:

<table height=&quot;100%&quot;>
 <tr height=&quot;1%&quot;> <!-- start header -->
    <td><img src=&quot;someimg.jpg&quot;></td>
    <td>some text, etc</td>
 </tr>              <!-- end header -->
 <tr>               <!-- start content -->
     <td colspan=2 valign=top>stuff here</td>   
 </tr>              <!-- end content -->
 <tr height=&quot;1%&quot;> <!-- start footer -->
     <td colspan=2><img src=&quot;someimg.jpg&quot;></td>
 </tr>              <!-- end footer -->
</table>

 

[gagz]

i'll give all this a shot, but the problem is i have to use separate tables because the site already existed and I can't change the header and footer I'll see how it goes...

 

[LV]

Maybe nested tables then?

<table height=&quot;100%&quot;>
 <tr height=&quot;1%&quot;> 
    <td>
      <table> <!-- start header -->
        <tr>
          <td><img src=&quot;someimg.jpg&quot;></td>
          <td>some text, etc</td>
        </tr>
      </table> <!-- end header -->
    </td>
 </tr>              
 <tr> 
   <td valign=top>              
     <table> <!-- start content -->
       <tr>
         <td>stuff here</td>   
       </tr>
     </table> <!-- end content -->
   </td>
 </tr>              
 <tr height=&quot;1%&quot;>
  <td>
    <table> <!-- start footer -->
      <tr>
        <td><img src=&quot;someimg.jpg&quot;></td>
      </tr>
    </table> <!-- end footer -->
   </td>
  </tr>              
</table>