Combining two or more CSS selectors with a boolean condition

Question

Is there a way to combine two or more CSS selectors using a boolean condition - and, or, not?

Consider this

<

Answer 1

This is a seriously old post, but I came across it and figured I'd add to it with the current CSS :not() selector:

Select BOTH classes

.message.error {}

Select EITHER class

.message, .error {}

Select NEITHER class

div:not(.message):not(.error) {}

.message {
  border: 1px solid;
}

.error {
  color: red;
}

.message,
.error {
  margin-bottom: 12px;
  padding: 12px;
}

.message.error {
  background: #ffcfcf;
}

div:not(.message):not(.error) {
  font: normal 20px "Comic Sans MS", cursive, sans-serif;
}

    ONLY .message



    ONLY .error



    BOTH classes



    NEITHER class