www.webdeveloper.com
Results 1 to 5 of 5

Thread: stretch div to bottom of page

  1. #1
    Join Date
    Oct 2009
    Posts
    1

    Question stretch div to bottom of page

    Hi, I'm working on my first site over at kindari.net. I would like the blue area to stretch to the bottom of the page. I can achieve this by adding height: 100%; to the .content class, but then it creates too much content, adding a scroll bar when there need not be. anyone know of a fix for this?

  2. #2
    Join Date
    Jul 2009
    Location
    Tennessee
    Posts
    28
    You could create a table which contains everything else on your page. Ensure that all of the row heights sum up to 100% height, and you should get the desired result. If you still need a .content DIV, you could stick it inside a table row and give the DIV 100% height (100% of the containing table row height).

    I'm sure there's a cleaner way to do this with CSS, but I'm not aware of it.

  3. #3
    Join Date
    Oct 2009
    Location
    Lawrence, KS
    Posts
    52
    So are you wanting one continuous blue box that stretches the whole length of the page, rather than just a blue background around each paragraph?

  4. #4
    Join Date
    Oct 2009
    Posts
    5
    http://www.webdeveloper.com/forum/sh...54&postcount=2

    Seems right no?

    Possibly add a footer to the bottom of the page to get the background.

  5. #5
    Join Date
    Jul 2008
    Location
    urbana, il
    Posts
    2,787
    Quote Originally Posted by Dave Lane View Post
    You could create a table which contains everything else on your page. Ensure that all of the row heights sum up to 100% height, and you should get the desired result. If you still need a .content DIV, you could stick it inside a table row and give the DIV 100% height (100% of the containing table row height).

    I'm sure there's a cleaner way to do this with CSS, but I'm not aware of it.
    No!!!!!!!!

    don't use a table, tables are for data, not layout.
    Tables are really bad for a lot of reasons.
    They negatively affect maintenance, accessibility, performance, and semantics...

    use css to control your layout, that's what it's for...

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

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



Recent Articles