Если на элемент назначены два CSS-класса с конфликтующими стилями, как сделать стиль одного класса приоритетнее без использования !important?

При равных условиях каскада разместите нужное правило позже либо используйте более специфичный селектор; порядок классов в HTML не решает конфликт.

Короткий ответ

Что ответить на собеседовании

При равных условиях каскада разместите нужное правило позже либо используйте более специфичный селектор; порядок классов в HTML не решает конфликт.

Подробный разбор

Ответ с пояснениями

При равных условиях каскада разместите нужное правило позже либо используйте более специфичный селектор; порядок классов в HTML не решает конфликт.

Например, .button.primary специфичнее .primary, если оба селектора совпадают. Более управляемый вариант — продумать порядок CSS layers или убрать дублирующие обязанности классов. Прежде чем наращивать специфичность, проверьте origin, слои и унаследованные значения. Простая перестановка class="a b" на class="b a" приоритет CSS не меняет.

ИИ-помощник для собеседований

Хочешь уверенно проходить собеседования?

Попробуй ИИ-помощник для собеседований: слышит вас и собеседника, анализирует экран, подсказывает ответы в реальном времени, работает без VPN и не попадает в захват экрана.

Подробнее