У меня есть следующий HTML-код для моей таблицы
Expense Type
Description
Price
Entry Date
Next Monitoring Date
Связанный css показан ниже для приведенной выше таблицы. Я уже пытался зафиксировать положение значений, однако, похоже, это не работает?
.table-container {
padding: 20px;
flex: 1;
overflow-y: auto;
}
.table {
background-color: #FFFFFF;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
margin-bottom: 0;
}
.table-responsive {
max-height: 650px;
}
том стиле, где я пытался использовать фиксированное положение, но это не сработало?
.table thead th {
position: sticky;
top: 0;
background-color: #F3F4F6; /* Matches the table container background */
z-index: 10; /* Ensures the header is above table rows */
border-bottom: 2px solid #E5E7EB;
text-align: center;
font-weight: bold;
color: #374151;
}
.table tbody tr:hover {
background-color: #F9FAFB;
cursor: pointer;
}
Стилизация тела таблицы td
.table tbody td {
vertical-align: middle;
text-align: center;
}
Подробнее здесь: https://stackoverflow.com/questions/793 ... -the-table
