css multiple class / id selectors?

Question

I'd like to know how to write a css block that applies to either multiple ids or multiple classes:

Something like:

.class1, .class2 {
 ...
}

or

#id1, #id2 {
 ...
}

I'd like to know how to do both cases (which hopefully are cross browser compliant). Thanks.

Update: To make it more interesting, is this valid too?

#id tr, #id2 tr {

}

?

Answer 1

You are looking for something like this :

.oddBoxOut, 
.evenBoxOut {
  width: 12em;
  padding: 0.5em;
  margin: 0.5em;
  border: solid 1px black;
}

.oddBoxOut {
  float: left;
}

.evenBoxOut {
  float: right;
}

Update :

p#exampleID1 { background-color: blue; } 
p#exampleID2 { text-transform: uppercase; }

Answer 2

For you update it is also valid,

#id1 tr {

}

means that every child of node id #id1 will be CSS'ed.

you can do this too

tr#id1 {

} 

Only tr will be affected if id == #id1