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 Coder
    Join Date
    Oct 2011
    Posts
    81
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Div full height of screen

    Hi all.

    This question is probably pretty stupid, I just started working with HTML and CSS and all, so I even had a lot of problems trying to build a simple website. All of them are solved now, but I still have one problem.

    I have three main divs: a header, a container div and a content div. But, my construction is a little bit complex. The content div is where I place all my text. I tried to put a background in the CSS of this content div, but that didn't work because my background and text would float over my header (some z-index issue).
    The container contains my entire other two divs, and I putted the background (the one that was supposed to be the background of the content div) in the container CSS. This solved the problem of my background floating over my header. My header, well, just contains my header image.

    Now everything is fine, except for one thing. The background from my container does not fill my entire page. The background from my container has to be the same length as the content div (where the background should actually be).

    I tried to solve this by putting
    #container{
    min-height: 100%;
    height: auto
    }
    but this only makes the div as long as the browser (my layout and content is longer than my browser).

    Is there a way to make the div (and so also the background) as long as my entire page (so not just as long as the browser) OR is there a way to make a certain div (in this case, the container div) the same height as another div (content div).

    I know this probably sounds really weird and maybe nobody understands what I mean, but I don't know how to explain it properly.

    Thanks in advance.

  • #2
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,335
    Thanks
    5
    Thanked 363 Times in 360 Posts
    A link to your live test site would be most helpful in someone trying to debug your issues.

    If no live site, then please post all your html and css using the # button to wrap your code in code tags.
    Teed

  • #3
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    if you want the background image to cover the entire page, you could apply it to the body element instead of your container div.

  • #4
    New Coder
    Join Date
    Oct 2011
    Posts
    81
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Oh, I forgot to tell! I already have a background image in my body, the background image I'm talking about now is just the background for the text. But now, I wonder, maybe I can solve this if there is a possibility to add a second background to the body?
    Last edited by apotd; 10-25-2011 at 08:23 PM.

  • #5
    New Coder
    Join Date
    Oct 2011
    Posts
    81
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Seems I have the same problem as explained here: http://csscreator.com/node/32234

    Only thing is, it was solved by removing a certain reset file linked from Yahoo, which I don't have.

    Any ideas?


  •  

    Posting Permissions

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