Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Member
    Join Date
    May 2003
    Posts
    92
    Member #
    1526
    Is there a way i can make a cell in my table stretch its height to make the table full page but not scroll? Like the autostretch thing in dreamweaver, only verticaly.
    If there is no god, then who pops up the next Kleenex?

  2.  

  3. #2
    Senior Member skrlin's Avatar
    Join Date
    Apr 2003
    Location
    Illinois
    Posts
    562
    Member #
    1063
    height="100%" ?
    - Brian

  4. #3
    Senior Member filburt1's Avatar
    Join Date
    Jul 2002
    Location
    Maryland, US
    Posts
    11,774
    Member #
    3
    Liked
    21 times
    Right, what Brian said. Just make sure there's no other text above or below the table or it'll scroll. That's a trick that I used to use on my designs about a year ago and I love it
    filburt1, Web Design Forums.net founder
    Site of the Month contest: submit your site or vote for the winner!

  5. #4
    Senior Member energizze's Avatar
    Join Date
    Oct 2002
    Posts
    260
    Member #
    238
    height='100%' doesn't work in most versions of IE.


    if i'm stretching verticly i tend to use javascript


    use:
    document.body.clientHeight;
    document.body.clientWidth;

    they'll return the height and width of the body area, but u have to recall those variables within the <body> tag.


    also if you want it to change as users change their window size use the window.onresize (or it's something like that).

  6. #5
    Senior Member skrlin's Avatar
    Join Date
    Apr 2003
    Location
    Illinois
    Posts
    562
    Member #
    1063
    You can do it the way filburt and I said this way:
    [minicode]<td height="100%">[/minicode]

    or if you want to do it energizze's way:
    Code:
    <html>
    <head>
    <script>
    var hgt, wth;
    function resizeIt() {
     if (navigator.appName.indexOf('Microsoft') != -1) {
      hgt = document.body.clientHeight;
      wth = document.body.clientWidth;
      document.all.bodyCell.style.height = hgt;
      document.all.bodyCell.style.width = wth;
     }
     if (navigator.appName.indexOf('Netscape') != -1) {
      hgt = innerHeight;
      wth = innerWidth;
      document.getElementById('bodyCell').style.height = hgt;
      document.getElementById('bodyCell').style.width = wth;
     }
    }
    </script>
    </head>
    <body onResize="resizeIt()">
    <table>
    <tr>
    <script type="text/javascript">
    hgt = document.body.clientHeight;
    wth = document.body.clientWidth;
    
    document.write('<td id="bodyCell" height="' + hgt + '" width="' + wth + '">');
    </script>
    ... content ...
    </td>
    </tr>
    </table>
    </body>
    </html>
    The above code (untested) should work for both IE and Netscape/Mozilla. Either way, if the user resizes the window, the table cell will resize with it.
    It's your choice, like I said both should work.
    - Brian

  7. #6
    WDF Staff smoseley's Avatar
    Join Date
    Mar 2003
    Location
    Boston, MA
    Posts
    9,729
    Member #
    819
    Liked
    205 times
    height="100%" works for TABLE elements and their children on IE5+ and NS6+

    That's most browsers today, so don't bother with going backwards compatible.

    You could also replace the table with a DIV:

    <div style="width: 100%; height: 100%">


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:41 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com