• # June 1, 2008 at 1:06 am

    First off, this is a great site! It’s late here so please excuse my spelling. I’m racking my brain trying to figure out how to use 2 different background images (top and bottom) for my pages. They are both gradient images 1px by 450px and I can have it repeat like I want it to using REPEAT-X but how do I get both images to show up: Here is the code I am using:

    body {background-image: url(‘/images/Stage_BG_top.png’); BACKGROUND-REPEAT: repeat-x; HEIGHT: auto; WIDTH: auto; POSITION: absolute; TOP: 0px; LEFT: 0px; TEXT-ALIGN: center}
    body {background-image: url(‘/images/Stage_BG_btm.png’); BACKGROUND-REPEAT: repeat-x; HEIGHT: 50%; WIDTH: auto; POSITION: absolute; BOTTOM: 0px; LEFT: 0px; TEXT-ALIGN: center}
    body {background-color: #c8e3f1}

    On the page using IE6, only the bottom image shows up. I want the whole page from top to bottom to fill with the image, and am trying not to use DIV.

    Any hekp is greatly appreciated. Thank you.


    # June 1, 2008 at 10:07 pm

    Thank you for the replies. The reason for not wanting to do the DIV elements,.. I like simplicity. I also fear that too many DIV elements will make the whole document complicated.

    The other thing I was looking at while reading the replies, is using multiple CSS in a document. Have one CSS for the top image and one CSS for the bottom. That should work shouldn’t it?

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.