Apply CSS rule to multiple divs?

HTML & CSS
1

I apologize for a rookie question, and have appreciate your help in dealing with me while I learn CSS.

I have a simple question that I can’t get to work. On my page I have multipe divs of different size: box1, box2, box3, box4. However I am trying to apply the same img rule to all of them, but can’t quite get it to work right.

Both ways i’ve tried:

#box1 #box2 #box3 #box4 img{
	width: 100%;
	height: 100%;
	z-index: 5;
}

and…

#box1 img
#box2 img
#box3 img
#box4 img{
	width: 100%;
	height: 100%;
	z-index: 5;
}

This is my simple html adding my id to the div:

        	<div id="box1">
            	<img src="Images/SplashImages/image0.jpg" alt="" width="300" height="300" />
            <!-- end #box1 --></div>

Any ideas? Thanks,
Lorne

2

Hi,

Each rule should be separated by a comma and will have no relation with whatever else is on the line. A comma separated list allows different selectors to have the same properties applied to them. Each selector though is individual and has no relationship with the other comma separated selectors.


[B]#box1 img, #box2 img, #box3 img, #box4 img{[/B]
	width: 100&#37;;
	height: 100%;
	z-index: 5;
}
3

Thanks,

I knew it would be simple, much obliged.

You guys are always so quick on these forums! Love it, thanks for the help.

Lorne

4

if your learning css i suggest you read (all of them are good even for beginners):
http://www.barelyfitz.com/screencast/html-training/css/positioning/
http://www.noupe.com/css/15-effective-tips-and-tricks-from-the-masters-of-css.html
http://www.hongkiat.com/blog/20-useful-css-tips-for-beginners/

http://www.1stwebdesigner.com/css/35-websites-to-teach-you-how-to-use-css-effectively/
http://www.webdesignerdepot.com/2009/08/250-resources-to-help-you-become-a-css-expert/

and when you think your getting the grasp of css, go and do these quizzes, they will blow your mind! :smiley:
test 1: [URL=“http://www.sitepoint.com/forums/showthread.php?t=169710”]test 2: [URL=“http://www.sitepoint.com/forums/showthread.php?t=170190”]test 3: [URL=“http://www.sitepoint.com/forums/showthread.php?t=171221”]test 4: [URL=“http://www.sitepoint.com/forums/showthread.php?t=172472”]test 5: [URL=“http://www.sitepoint.com/forums/showthread.php?t=173786”]test 6: [URL=“http://www.sitepoint.com/forums/showthread.php?p=3216244”]test 7: [URL=“http://www.sitepoint.com/forums/showthread.php?p=3235664”]test 8: [URL=“http://www.sitepoint.com/forums/showthread.php?p=4108145”]test9: [URL=“http://www.sitepoint.com/forums/showthread.php?p=4119063”]test10: [URL=“http://www.sitepoint.com/forums/showthread.php?t=595943”]test11: [URL=“http://www.sitepoint.com/forums/showthread.php?t=597256”]test12:

test13: [URL=“http://www.sitepoint.com/forums/showthread.php?t=600332”]test 14: [URL=“http://www.sitepoint.com/forums/showthread.php?t=601564”]test 15: [URL=“http://www.sitepoint.com/forums/showthread.php?t=602808”]test 16: [URL=“http://www.sitepoint.com/forums/showthread.php?t=604228”]test 17:[URL=“http://www.sitepoint.com/forums/showthread.php?t=605819”]test18 [URL=“http://www.sitepoint.com/forums/showthread.php?p=4218017”]test 19:
test 20 [URL=“http://www.sitepoint.com/forums/showthread.php?t=611825”]test 21: [URL=“http://www.sitepoint.com/forums/showthread.php?t=615364”]test 22:[URL=“http://www.sitepoint.com/forums/showthread.php?t=617015”]test 23 :[URL=“http://www.sitepoint.com/forums/showthread.php?t=618512”]test 24 : [URL=“http://www.sitepoint.com/forums/showthread.php?t=626405”]test 25: [URL=“http://www.sitepoint.com/forums/showthread.php?t=630173”]test 26 : [URL=“http://www.sitepoint.com/forums/showthread.php?t=635116”]test 27

5

Sweet thanks. This site: www.slarc.com/test is my first css site and I think I’m getting the hang of it. It’s less and less that I am running into hiccups I need help on.

I appreciate the links, I’ll take a look at them!

6