Блог

Я перепробовал все возможные поиски и это, и ничего не добился. У меня есть таблица с thead tr набором position: sticky , однако она работает не так , как хотелось бы — текстовое содержимое td переходит на липкий th , фон покрывает элементы, но текст переходит, как сэндвич ;’d.

ДЕМОНСТРАЦИЯ

Мерзавец

Я пробовал использовать негатив z-index , translateZ(0) и, похоже, ничего не работает..

Я просто удалил липкое, а затем заметил, что оно закрывает боковую панель. Поэтому сохранение липкости и изменение z-индекса на 200 и тега в сторону на 300 сработало для меня. Дайте мне знать, если я что-то упущу.

 thead {
position: sticky;
z-index: 200;
}

aside {
grid-area: aside;
display: flex;
flex-direction: column;
gap: 2rem;
height: 100%;
color: var(--theme-light);
background: linear-gradient(30deg, var(--theme-dark), var(--theme-dark_darker));
position: relative;
z-index: 300;
width: 100%;
height: 100%;
transition: width .2s ease-out;
}