The forums have permanently moved to This forum will be kept around in read-only mode for archival purposes. To learn how to continue using your existing account on the new forums, check out this thread.

Results 1 to 5 of 5

Thread: 100% repeating background on div?

  1. #1

    100% repeating background on div?

    I currently have a repeating background on the body and have a fixed container size, however at the end of each page I would like to have a footer with a repeating background in a div that fills the entire length of the window. ie not just the width of the container size.

    How can I achieve this, any help is appreciated?

  2. #2
    Without seeing any of the code you're working with it's hard to just give you the answer.

    But in theory... place a div outside of your container that has the fixed width. Set the background with CSS and repeat it horizontally.

    If you place your code here or a link to it, it'll be easier to give you a better response.
    Γνώθι Σεαυτόν

  3. #3
    Here is a stripped down version,

    I am trying to get the black stripe div footer to repeat 100% of the browser window, notice I have fixed width container. The footer should be at the bottom and outside of the container. Thanks for the help.

  4. #4
    Honestly, I'd recode the CSS if I were you. You're using position: absolute and relative all over the place when it's not really necessary to do that.

    You should be able to leave the body background as you have it.
    Start your containing div that sets the width and place all your information in there using floats to layout the site.
    Close that containing div and then place a footer outisde of the containing div and use your footer background.

    It seems like a lot of your position: relative calls aren't necessary or at being used to move elements into a position that could just as easily be done by using a margin, some padding or both.

    postion: relative changes the normal flow for the elemet it's applied to, but the elemets after it are uneffected. Which means if you start using position: relative on one element to put it in a certain place, you may need to use it on other elements to do the same. In doing that everything's pushed all around, things are being covered up and you end up with a mess on your hands.
    Γνώθι Σεαυτόν

  5. #5
    Thanks for the reply Ankou. Im aware of the positioning properties but thought they were relevant to my layout and positioning. I will look into your suggestions.

Thread Information

Users Browsing this Thread

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

Posting Permissions

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

Home About Meet the Moderators Advertise

 Link to Us


Copyright 1999 - 2012