Forums

Al3ks

Hi everyone,

I'm trying to make a div have two backgrounds, i tried lots of things but nothing works.

here is what I am trying to achieve:

Any help would be very appreciated.

knittingfrenzy18

First of all, your image disappeared.

Second, CSS3 can do this, but it doesn't have adequate support in all browsers yet. If you wanted to try it out for the browsers that do support it, you use this syntax:


#myDiv {
background: url(http://mysite.com/image1.jpg) no-repeat top left, /* watch the comma there */
	 	    url(http://mysite.com/image2.jpg) no-repeat bottom right; /* now a semicolon */
}

Note that you can use as many as you want, but it's generally depreciated. Make sure to specify locations for the backgrounds or they'll pile up.

Also, note that if you want a background COLOR in addition, you'll need to declare this separately as

background-color: #fff;

with whatever color you want. If you try to mix it in with the multiple backgrounds, it won't work.

treehouse : what would you like to learn today?

Forums

DIV with two background?