Как задать стиль объекта в CSS, который будет применяться при выполнении медиа-запроса или при наличии у родительского объекта опред. класса?

Question

[ReaL_HarDCorE]

Друзья, привет!

Вот есть стиль, который будет применяться к объекту, если ширина окна между 700 и 1000 px.

@media (max-width: 1000px) and (min-width: 700px) {
    .selector1 {
        color: #000;
    }
}

Но мне нужно, чтобы этот стиль применялся к объекту с классом selector1 ещё и в том случае, если какой-то из родительских объектов имеет класс .example_class. То есть что-то типа вот этого:

.example_class .selector1 {
    color: #000;
}
@media (max-width: 1000px) and (min-width: 700px) {
    .selector1 {
        color: #000;
    }
}

В данном случае стиль продублирован, и это не хорошо.
Как совместить эти два условия?

Заранее большое спасибо!

Comments

[darhVader]

А сделать так? Не выход?

.example_class.selector1 {
color: #000;
}

Answer 1

[Александр Таратин]

Используйте less/sass