Таблица данных с использованием элементов CSS Grid и Div ⇐ CSS

[Anonymous]

Я создал таблицу данных, используя элементы CSS Grid и Div. Раньше я использовал Display Flex, но у меня возникли проблемы с реализацией rowspan и colspan с элементами Div.

Код: Выделить всё

.grid-responsive {
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}

.grid .grid-header {
background-color: #e2e3e5;
color: #000;
}

.grid .grid-row {
display: grid;
grid-template-columns: 50px repeat(2, 1fr) 100px;
}

.grid .grid-row .grid-col {
padding: .5rem .5rem;
border-right: 1px solid #cfd0d2;
border-bottom: 1px solid #cfd0d2;
}

.grid .grid-row .grid-col:last-child {
border-right: none;
}

.grid .grid-row:last-child .grid-col {
border-bottom: none;
}

Код: Выделить всё

#
First Name
Last Name
Roll




1
Sandip
Saha
10


2
Rahul
Saha
20

Подробнее здесь: https://stackoverflow.com/questions/787 ... v-elements