В CSS, как мне оформить div, у которого есть два класса?

Question

У меня есть div с определенным следующим классом CSS:

<div class="ui-button ui-state-active">bla bla bla</div>

Я пытаюсь определить стиль CSS для этого класса, делая это следующим образом

<style>
    .ui-button .ui-state-active {
        background-color:#000000;
    }
</style>

Это не такработает, я имею в виду класс неправильно?

Спасибо

Answer 1

Удалить пробел:

.ui-button.ui-state-active

с пробелом, правило гласит "элементы с классом ui-state-active, которые являются потомками элементов сclass ui-button ".

Указание нескольких классов с ошибкой в ​​IE6 : Для IE6 правило будет применяться ко всем элементам с классом ui-state-active.(Спасибо @Meder за напоминание)

Answer 2

.ui-button.ui-state-active {} 

Хотя это, вероятно, не сработает в IE6, если это имеет значение.

Answer 3

Почему бы просто не изменить класс на ui-state-active и скопировать CSS? (Я знаю, что это дублирующий код)

<div class="ui-state-active">bla bla bla</div>

<style>
.ui-button {
    background-color:#000000;
}
.ui-state-active {
    background-color:#000000;
    color:blue;
}
</style>