HTML-таблица с радиусом границы и прикрепленным заголовком ⇐ Html

[Anonymous]

У меня есть HTML-код с border-radius и прикрепленный заголовок с использованием позиции: Sticky, который выглядит следующим образом:
https://codepen.io/muhammadrehansaeed/pen/OJpeeKP


Однако при прокрутке с закрепленным заголовком строки таблицы выступают там, где находится закругленный угол закрепленного заголовка. См. верхний левый угол этого изображения:



Есть ли способ сохранить закругленные углы при прокрутке вниз с помощью липкого заголовка или удалить липкий заголовок, когда заголовок становится липким и перемещается вниз из исходного положения? В идеале мне хотелось бы использовать только CSS решение.

Подробнее здесь: https://stackoverflow.com/questions/681 ... cky-header