Search code examples
cssstylesheet

How to combine this css?


.box_content ::selection {
 background:#CCCC33; /* Safari */
}
.box_content ::-moz-selection {
 background:#CCCC33; /* Firefox */
}

Anyone know if I can combine those like this?

.box_content ::selection .box_content ::-moz-selection {
 background:#CCCC33;
}

Or maybe like:

.box_content ::selection, .box_content ::-moz-selection {
 background:#CCCC33;
}

Solution

  • The second one is correct. You can use a comma to separate css selection rules.

    So given:

    selector-rule1, selector-rule2 {
        style-x;
        style-y;
    }
    

    This will apply style-x & style-y to anything that matches either selector-rule1 or selector-rule2.


    Just to explain why your first example won't work, its because spaces imply ancestor-descendant relationships, so if you have:

    selector-rule4 selector-rule4 {
        style-z;
    }
    

    Then style-z will be applied to anything that matches selector-rule4 if it is also an an ancestor of something that matches selector-rule3.

    More info on selectors here.