Hello-
I am still in the newbie stages of CSS.
What I have on my page is 8 div boxes, each with a different background image in it.
My question is about efficiancy.....right now I have 8 different divs defined in my CSS. The problem is that all of the other properties are the same for the divs, except background image. So is there a way I could just make one main div declaration and then have 7 items following that declare a different instance with a different background.
I was thinking of using a class selector but I'm not sure how this would work after reading about them and trying it out I now have no background images, is this the wrong idea? or is there another approach?
simple selector question...i think
.inset1, .inset2, .inset3, .inset4 { float: left; margin: 0; padding: 0; } .inset1 { background-image: url(images/bg_1.gif); } .inset2 { background-image: url(images/bg_2.gif); } .inset3 { background-image: url(images/bg_3.gif); } .inset4 { background-image: url(images/bg_4.gif); }
simple selector question...i think
Thanks that sure was easy. : )
Out of curiosity could I do the same thing with
#inset?
From what I understand you only use the "#" for a single instance of something, so does that mean using commas does not work?
simple selector question...i think
no, you can still declare similar styles for several id's at once:
#inset1, #inset2, #inset3 { border: 0; padding: 10px; }
the difference is that, you only want to use each id in one place on each page (id's are unique selectors). that's all that is meant by them being unique. you can handle them on your style sheet the same way as any other selectors.