Я знаю, что при коде вида .class1 + .class2 заданые стили применятся к классу class2, который следует сразу после class1. Но как мне задать стили конкретно классу1, после которого есть class2?
Ответ
Поскольку обратного селектора, вроде .class1 - .class2 в CSS не существует, какой-нибудь частный случай можно решить селектором + или ~, назначением display: flex родителю и установкой order потомкам. Разметка при этом должна исходить из того, что «предыдущий» элемент должен располагаться ниже. Альтернативой свойству order может быть свойство flex-direction: row-reverse
.container {
display: flex;
}
.child {
border: 1px solid;
padding: 1em;
}
.class2 {
order: 1
}
.class3 {
order: 2
}
.next ~ .prev {
background: #ccc;
}
class3
class2
class1
Комментариев нет:
Отправить комментарий