Results 1 to 7 of 7
  1. #1
    Join Date
    Aug 2009
    Location
    Limerick, Ireland
    Posts
    91
    Plugin Contributions
    0

    Default 100% Page Height

    Hello,

    I want to give my site a 100% page height.

    In other words, for pages that do not fill the screen vertically with content I would like the page to continue and fill the screen vertically.

    Any suggestions would be very much appreciated.

    Current site (work in progress) - http://www.safebaby.ie

  2. #2
    Join Date
    Feb 2005
    Location
    Lansing, Michigan USA
    Posts
    20,021
    Plugin Contributions
    3

    Default Re: 100% Page Height

    There's a thread here:

    http://www.zen-cart.com/forum/showthread.php?t=104107

    But I think the real answer is to balance your middle content with your sideboxes.

  3. #3
    Join Date
    Aug 2009
    Location
    Limerick, Ireland
    Posts
    91
    Plugin Contributions
    0

    Default Re: 100% Page Height

    Thanks for your help.

    I added the following to my CSS file as the above thread suggested;

    html {
    height:100%;
    }

    body {
    height:100%;
    }

    #mainWrapper {
    height:100%;
    }

    This does make the page 100% height as I had asked but it does not move the footer to bottom of the page.

    You can see what it is doing here: http://www.safebaby.ie/

    Any suggestion on how to go about having the footer at the bottom of the page ( or hug the bottom of browser window) ?

  4. #4
    Join Date
    Aug 2009
    Location
    Limerick, Ireland
    Posts
    91
    Plugin Contributions
    0

    Default Re: 100% Page Height

    Unfortunately no seems to know how to do this, so I have had to remove the changes I made above and revert back to having the site only take up two thirds of the screen.

    Having the site only take up a certain amount of the screen is ugly in my opinion and if anyone ever comes across a solution for a 100% page height for Zen Cart please let me know.

    Thank for the help anyway.

  5. #5
    Join Date
    Feb 2005
    Location
    Lansing, Michigan USA
    Posts
    20,021
    Plugin Contributions
    3

    Default Re: 100% Page Height

    How about doing what you did and moving the footer down with something like this?:

    #footerhsy {margin-top:200px;}


    #footerhsy doesn't exist in a stock Zencart installation. That might be why it didn't work just by using the changes in the other thread.

  6. #6
    Join Date
    Aug 2009
    Location
    Limerick, Ireland
    Posts
    91
    Plugin Contributions
    0

    Default Re: 100% Page Height

    Hi stevesh,

    Thanks once again for your suggestion.

    I tried what you suggested above but it unfortunately did not work (even though I see where you were coming from).

    Result of the above suggested change can be seen here: http://www.safebaby.ie/

  7. #7
    Join Date
    Feb 2005
    Location
    Lansing, Michigan USA
    Posts
    20,021
    Plugin Contributions
    3

    Default Re: 100% Page Height

    Which looks to me like exactly what you wanted, in IE anyway. It looks like the footer doesn't go down as far in FF, but you should be able to play with px, em or % in the margin statement to make it right, I think.

 

 

Similar Threads

  1. Unwanted gap and how to make page 100% height always
    By Rob100 in forum Templates, Stylesheets, Page Layout
    Replies: 7
    Last Post: 11 Jun 2010, 01:03 PM
  2. How to make mainwrapper height 100%?
    By julieoolie in forum Templates, Stylesheets, Page Layout
    Replies: 14
    Last Post: 16 Oct 2008, 06:32 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
disjunctive-egg