Здравствуйте!
Есть разметка:
<div class="wrapper">
<div class="block"></div>
<div class="main"></div>
<div class="block"></div>
<div class="block"></div>
</div>
Количество их может варьироваться.
Вопрос: как привязать высоту элементов к их классу? Чтобы высота элементов с классом «block» была «auto», а высота элементов с классом «main», была «1fr».
Вот такой код не подходит:
grid-template-rows:
auto
1fr
auto
auto
;
...так как, всякий раз, при добавлении нового блока, надо лезть в CSS, искать, анализировать и прописывать новую структуру. А так - мы оперируем классами в HTML, и CSS не трогаем.
Нужно что-то типа этого:
div.wrapper {
display: grid;
}
div.block {
[нужное свойство]: auto;
}
div.main {
[нужное свойство]: 1fr;
}
Спасибо!
Простой
