Can I use background-image-left and background-image-right?

Discussion in 'CSS' started by bass, Aug 3, 2009.

0
  1. #1
    I want to separate 2 backgrounds includes left background = url(bg-l.jpg) 550px and right background = url(bg-r.jpg) repeat-x.

    Can I use that?

    Thank you.
     
    bass, Aug 3, 2009 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    There is no such thing and you can only have one background image.
     
    drhowarddrfine, Aug 3, 2009 IP
  3. bass

    bass Active Member

    Messages:
    738
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    53
    #3
    I want to use different 2 background the left is background includes image and the right is pure background with auto repeat!
     
    bass, Aug 3, 2009 IP
  4. gareth_gillman

    gareth_gillman Peon

    Messages:
    38
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    ok what do you mean ?

    you want 2 background as you have 2 columns ?

    why not create 2 divs each 50% wide and 100% high and each one has either float:left; or float:right;

    then set the background of the div,
     
    gareth_gillman, Aug 3, 2009 IP
  5. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,999
    Best Answers:
    253
    Trophy Points:
    515
    #5
    Unless you are willing to risk CSS3 (and have it not work in IE) CSS does not allow you to specify two backgrounds for one element. You need one element for each background-image you specify.

    What element are you trying to apply that to? Body? A child element? Something else?

    Your best bet is probably going to be a 100% min-height layout to pull that off if you want to put it on BODY. Set the repeat-x one on body, and the left background on your page wrapping element set to 100% min-height.
     
    deathshadow, Aug 3, 2009 IP
  6. Braydo25

    Braydo25 Active Member

    Messages:
    144
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #6
    Just used 2 <div> elements that wrap around the content the background image will be behind. Specify a unique css class or id for each (Up to you, doesn't really matter in this circumstance) Use a different background image for each div class (whatever you wanted for the background) position each image.
     
    Braydo25, Aug 3, 2009 IP