Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts

    CSS Background Height

    http://hs.nuvolab.com/
    http://hs.nuvolab.com/index.css

    As you can see, the site is split into three sections; Left, Right, and footer. The problem is that when the Left section has a greater height, the Right section doesn't show a background (and vice versa). Is there a way to fix this?

    (I have tried a single background image in the ".content" class for the left and right sections; it overflows into the bottom of the page, past the footer.)

    Any help would be appreciated, thank you.

  • #2
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    You didn't slice the layout to well. For example in your right div why do you have that blackish area in your slice? Just slice it up to the white area. Your whole layout should be 750px for example why do you even have this image?
    http://hs.nuvolab.com/images/leftbg.jpg
    It can all be done in CSS.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #3
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Alright, I got rid of the border in the slices, added background-color: #ffffff; to the class ".content" to fill in the white instead of using images for the background.

    Unfortunately, as you can see, it overflows past the footer. Any suggestions?

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Yeah add units to all of your measurements. You have things like padding: 30 20 0 20; which should be padding: 30px 20px 0 20px;
    You don't need units on 0 values unless its line height. Everything else though you need units. Now once you've done that make your footer 57px high. Your top padding is counted for overall height so your footer is 127px + 70px high
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    New to the CF scene
    Join Date
    Apr 2006
    Posts
    9
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Awesome, thank you ^_^


  •  

    Posting Permissions

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