SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Member
    Join Date
    May 2003
    Location
    UK
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    2 background images

    can anyone tell me why this css code wont work please

    body
    {
    margin:0px auto;
    padding:0px;
    background-image:url(images/body-top-bg.jpg), url(images/footer-bottom-bg.jpg);
    background-repeat:repeat-x, repeat-x;
    background-position:center top, left bottom;
    max-width: 1024px;
    }

    both background work the way i want on there own but there must be away of displaying 2 together 1 header, 1 footer

    any help would be great

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,513
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    It doesn't work because you can't apply 2 images to an element.

    You can only place one background image per element (ignoring :before :after and content:"").

    You will need to use 2 containers and apply an image to each. You can use the body for one image and then use a main container for the other image.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,513
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    Quote Originally Posted by Ben
    Maybe you can use the html + body
    Yes that's fine but as long as you are not worried about ie5.+ (and ie6 in quirks mode) that don't recognise the html element.

    Otherwise its a good method and saves on mark-up


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
  •