%,min,max size table

[ThomasJSmart]

is it possible to give a table a 100 % height value, but at the same time give it a minimum and maximum height?

example
a table is 100% height, so it resizes as the browser window is resized. If the resized browser window height is less than X then the table will freeze at 300 pixels height and a scrollbar will apear for the rest. On the other hand if the browser window height is more than Y the table will freeze at 800 pixels.





I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!

 

[LTeeple]

You need to use spacer images to achieve this.
Just create a transparent image 1px x 1px

<table width="100%">
  <tr>
    <td rowspan="2" scope="row"><img src="/images/spacer.gif" width="1" height="300">test</th>
    <td colspan="4"><img src="/images/spacer.gif" width="800">test</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

Cheers!
Laura

 

[ThomasJSmart]

that sets the 100% height and minimum size, but how can i set the table to not get higher than 800 px?


I learned a bit yesterday, today i learned a lot, imagine what i'll learn tomorrow!

 

[LTeeple]

sorry the height larger than 800px or the width larger than 800px?

If it's width: use a nested table - just set the container table width to 800px like so:

<table width="800" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td width="100%">
      <table width="100%">
        <tr>
          <td rowspan="2" scope="row"><img src="/images/spacer.gif" width="1" height="300">test</th>
          <td colspan="4"><img src="/images/spacer.gif" width="800">test</td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
          <td>&nbsp;</td>
        </tr>
      </table>
    </td>
  </tr>
</table>

If you're looking to limit height, I'm not sure if you can. Eventually the contents will wrap, and force a scroll down.


Cheers!
Laura

 

[Vragabond]

That won't really work, because inner table is 100% wide in relation to 800px wide outer table. Scrollbars will appear and mess up. Look at this old thread for a CSS answer (IE needs a little nudge, but it works fine):

http://www.tek-tips.com/viewthread.cfm?SQID=847438&SPID=215&newpid=215&page=4

 

[BillyRayPreachersSon]

Hi Vragabond

I still think that that is one of the most useful posts I've read since joining TT

Dan