css question

NeVeR

Hi all,

I want to have the same css code apply to more then 1 div tag,

my div tags are

<div =id"b"></div>
<div =id"c"></div>
<div =id"d"></div>

and i want the "links" in those tags to be different then the rest of the page.

So i tried this

#b c d a{
color:#ffffff;}

and
#b,c,d a{
color:#ffffff;}

but that didnt work either.
What am i doing wrong?

thanks.

NeVeR

ah it's ok.. I just added the special link info to the wrapper i had around those DIV's
thanks

Stab*City

solved your own problem.. nice..

DonkeyStyle \o/

What I usually do is make a class that they can all share:
.shared { bold pink blinking comic-sans }
.box1 { black background }
.box2 { blue background }
.box3 { yellow background }


Then set them up using:
<div class="shared box1"></div>
<div class="shared box2"></div>
<div class="shared box3"></div>

It also seems to work mixing classes and ID's: (assuming .shared and #box1)
<div class="shared" id="box1"></div>
Though I'm not sure how technically correct it is to do this or which styles override the other in the case of a conflict. (at least that'll give me something else to do (hmm, the ID wins apparently))

Then for the in-div links you can just do this:
.shared a:active {color: #500;}
.shared a:visited {color: #400;}
.shared a:link {color: #450;}
.shared a:hover {color: #800;}

p

Adding it to the wrapper is generally the correct approach. Here's an example:

[HTML]<div id="navbar">
<a href="#">link</a>
<a href="#">link</a>
<a href="#">link</a>
</div>[/HTML]
& CSS:

#navbar a {
  color: #FFFFFF;
}

For your reference, the reason your original example didn't work was because you structured your rule wrong. For more info check out these explanations:

http://css.maxdesign.com.au/selectutorial/rules_group_sel.htm
http://webdesign.about.com/od/cssselectors/qt/tipcssgroupsele.htm
http://bitesizestandards.com/bites/css-selectors-the-basics

The problem in your code was that you grouped the selectors incorrectly. Each comma seperates and entirely different rule, so:

.navbar a {
color: red;
}

and 

.navbar b {
   color: red;
}

can be grouped like this:

.navbar a, .navbar b {
   color: red;
}

To apply that to your initial example, you should do this. (I've separated them onto separate lines for clarity, though it's not necessary.

#b a,
#c a,
#d a
{
   color:#ffffff;
}

Hope that helps. I suggest you read up a little bit more about CSS selectors and grouping rules together. It's sometimes tough to get your head around, but once you have the 'light bulb moment' it's easy from there on in.

All the best!