How to make conditions in a CSS stylesheet?
Here I got a stylesheet.. But if the div.menu_active is added on an element the class has to behave like its hovered? How can you do that?
Or is there an even better way to contruct the stylesheet for this solution?
<div class="menu">menu</div>
<div class="menu menu_active">menu</div> // has to behave like menu:hover
<div class="menu_green">menu</div>
<div class="menu_green menu_active">menu</div> // has to behave like menu_green:hover
div.menu {
background:url('menu_opacity50.png');
}
div.menu_green {
background:url('menu_green_opacity50.png');
}
div.menu_active {
}
div.menu:hover {
background:url('menu_opacity100.png');
}
div.menu_green:hover {
background:url('menu_green_opacity100.png');
}
If I understand correctly, this is what you need:
.menu.menu_activewill select elements that have both of the listed classes, such as<div class="menu menu_active">.