How to combine this css?


Tags: css,stylesheet

Problem :

..

.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;
}

Honestly my mind is not there today.



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.


    CSS Howto..

    Why does first slideshow image click skip transition and go straight to image?

    Can't figure out how to horizontally CENTER my content div [duplicate]

    How do I create 3D perspective using CSS3?

    Mini-map of HTML page sections shown as fixed anchors in viewport

    How to set css attribute for pseudo element in Dart

    How to Implement this UI with CSS [closed]

    How to fix smooth text in IE?

    How can I make this Asp.net button have the same CSS as this

    How to delay one transition but not the other?

    How to remove only one media rule property from external css

    How to move the scrollbar down

    My sidebar is not going to right of my page, but to my left. How do I fix this?

    How to create transparent background color in html & css [duplicate]

    How do I limit the number of cells on a row in CSS

    How to control the text inside DIV tag by not allowing the text to be increased?

    How to display results comming from database in 3 columns using php/mysql/html/css

    How to create a Twitter Bootstrap Textarea

    How to understand other people's CSS architectures?

    How to avoid bootstrap from overriding id-called custom css?

    How to add css to a single mvc Helper method when validation fails - from within the model

    How to use CSS calc according to a certain amount of li's?

    CSS: show only the last x items in a list

    How to add static files using Spring MVC and Thymeleaf

    How to add and remove div's (input)

    How to display last div at top using CSS?

    How to set two floated divs to be the 100% height of the page

    How do I constraint an animation using only CSS and HTML?

    How to put bootstrap code inline

    How to add 2 jScrollPane to my page and each one has different CSS?

    How can I place a checkbox within a button? [closed]