I would like to know how I can set one setting for two different classes.
To give an example:
.footer #one .flag li .drop_down form div{
width: 80px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
text-align: left;
line-height: 1.5;
color: #ccc;
font-weight:bolder;
margin-left: 30px;
}
.footer #two .flag li .drop_down form div{
width: 80px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
text-align: left;
line-height: 1.5;
color: #ccc;
font-weight:bolder;
margin-left: 30px;
}
Both rules have the same content. The difference is just the second tag. Is there a way to do something like this?
.footer >>>#one and #two<<<< .flag li .drop_down form div{
width: 80px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
text-align: left;
line-height: 1.5;
color: #ccc;
font-weight:bolder;
margin-left: 30px;
}
Separate the selectors with a comma:
.footer #one .flag li .drop_down form div,
.footer #two .flag li .drop_down form div {
/* Rules */
}
From the selectors level 3 spec:
A comma-separated list of selectors represents the union of all elements selected by each of the individual selectors in the list. (A comma is U+002C.) For example, in CSS when several selectors share the same declarations, they may be grouped into a comma-separated list. White space may appear before and/or after the comma.