SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    May 2003
    Posts
    164
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    resolution independent layout

    I'm not sure where to post this, but anyway I have a problem with achieving a layout where I have three DIVs:

    ----------------------------------

    DIV class=top
    ----------------------------------



    DIV class=main


    ----------------------------------

    DIV class=foot
    ----------------------------------

    I wanted a resolution independent layout whereby the top and bottom
    DIVs fit EXACTLY to the top and bottom of the page,without any scrollbars or whitesoaces. There isnt any text yet which could make it scroll. I dont have a problem with the horizontal aspect,but the vertical layout gives me a headache. maybe i need to redesign from scratch.

    any helpful links or info?

    thanx!

  2. #2
    SitePoint Addict
    Join Date
    Jun 2004
    Location
    UK, London
    Posts
    312
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by tinonetic
    I'm not sure where to post this, but anyway I have a problem with achieving a layout where I have three DIVs:

    I wanted a resolution independent layout whereby the top and bottom
    DIVs fit EXACTLY to the top and bottom of the page,without any scrollbars or whitesoaces. There isnt any text yet which could make it scroll. I dont have a problem with the horizontal aspect,but the vertical layout gives me a headache. maybe i need to redesign from scratch.

    any helpful links or info?

    thanx!
    Well, the page is the textual content of the document, not the size of your browsers viewport. Therefore you need to fake a height. Some good info can be found on ALA: http://www.alistapart.com/articles/footers/ Also make sure to read the comments.

    As for the scrollbar, you can set the overflow to hidden, but this is rather evil, as users with a small viewport will get cropped content. The web is no canvas.
    Chris Heilmann
    Blog | Articles | Binaries

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,545
    Mentioned
    183 Post(s)
    Tagged
    6 Thread(s)
    DIVs fit EXACTLY to the top and bottom of the page,without any scrollbars or whitesoaces. There isnt any text yet which could make it scroll. I dont have a problem with the horizontal aspect
    If you look in the FAQ section there is a long explanation on how to achieve 100% height and will do exactly what you want.

    Have a look at my 3 col demo (sticky thread which all do this).

    Don't bother with the listapart article as they get it wrong My method had been in use for some time and works well on nearly all browsers (except safari and ie mac and there are even fixes that you can do for them).

    Paul

  4. #4
    SitePoint Zealot
    Join Date
    May 2003
    Posts
    164
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)


Bookmarks

Posting Permissions

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