CSS rule to apply only if element has BOTH classes [duplicate]

Question

Let's say we have this markup:

<div class="abc"> ... </div> <div class="xyz"> ... </div> <div class="abc xyz" style="width: 100px"> ... </div> 

Is there a way to select only the <div> which has BOTH abc and xyz classes (the last one) AND override its inline width to make the effective width be 200px?

Something like this:

[selector] {   width: 200px !important; } 

Answer 1

div.abc.xyz {     /* rules go here */ } 

... or simply:

.abc.xyz {     /* rules go here */ } 

Answer 2

Below applies to all tags with the following two classes

.abc.xyz {     width: 200px !important; } 

applies to div tags with the following two classes

div.abc.xyz {     width: 200px !important; } 

If you wanted to modify this using jQuery

$(document).ready(function() {   $("div.abc.xyz").width("200px"); });