Semantic UI - Keep thead visible when scrolling tbody

Question

I'm trying to figure out how to keep the table head visible when scrolling. Is there a setting in semantic ui for this? Or will I just have to use a non-semantic ui solution?

You'll need to view "Full page" to see the table correctly.

Answer 1

I solved the problem with position: sticky, like this:

.ui.table thead tr:first-child > th {
     position: sticky !important;
     top: 0;
     z-index: 2;
}