SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Aug 2003
    Location
    NoVA
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Menu doesn't push the footer down

    I didn't really know how to describe this, so apologies for the poor thread title.

    I've got a CSS-layout page that has a menu on the left and the content on the right, in a fixed-width design. The problem is when the menu is "taller" than the content on the right, the menu goes past the footer at the bottom and makes the page look odd.

    Problem: http://eqdkp.com/main2/?p=donate&confirm=true (content is shorter than the menu)
    How it should look: http://eqdkp.com/main2/?p=news (content is longer than the menu)

    I'm a tables-for-layout guy, so this CSS layout is a bit new to me. What am I doing wrong?

  2. #2
    SitePoint Zealot Sork's Avatar
    Join Date
    Jul 2002
    Location
    Portugal
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    try put this div
    Code:
    .clear-both {
     	clear: both;
     }
     ....
     <div class="clear-both">&nbsp;</div>
    after your content and menu and before the footer.

    hope that helps

  3. #3
    SitePoint Enthusiast
    Join Date
    Aug 2003
    Location
    NoVA
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the suggestion. I was hopeful, but it doesn't look like it worked. I left the modified version up if you want to take another look.

  4. #4
    SitePoint Zealot Sork's Avatar
    Join Date
    Jul 2002
    Location
    Portugal
    Posts
    143
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well difficult to see your source

    To work you will need to set a main div that will have the content and menu.
    Then right after the content and menu, and still inside the main div, you put the div with clear-both class.
    Like this
    Code:
       +----------------------------------------+
       |    +----------+    +-----------------------+   |
     | |			 | |		 			 		 | |
     | |	menu | |	 content 	 			| |
     | |			 | |		 			 		 | |
       |    +----------+    +-----------------------+   |
       |    +------------------------------------+   |
     | | clear: both div 	 			 			| |
       |    +------------------------------------+   |
       +---------------------------------------+
    I think you missing this in your code, dunno.

    ps: cant get this tab/space work on this editor, hope you understand

  5. #5
    SitePoint Enthusiast
    Join Date
    Aug 2003
    Location
    NoVA
    Posts
    64
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Started over and got it fixed. Thanks.


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
  •