List Manager Forum

Making header rows 'sticky'

User Alex King 2026-05-15 13:07:30

Hi - is there a way of making the header row of a table 'sticky' so it doesn't scroll past the top when someone is scrolling down the table content? This would mean the header column titles were always visible when the user is viewing data in the lower parts of the table. I have tried the 'position: sticky' in the custom css but it doesn't seem to have any effect.

Moonsoft support 2026-05-18 09:45:44

Hi,
there is no simple way to set bootstrap responsive tables with sticky header, but you can try to add this css section in order to have the sticky header into a table adding a maximum height, something like:

thead {
position: sticky;
top: 0;
z-index: 10;
background-color: #fff;
}

table.table{
overflow-y: auto !important;
max-height: 600px;
display: grid;
}

Hope this helps, regards
Silvia Martín
Moonsoft Team

User Alex King 2026-05-19 14:10:47

Perfect thankyou - exactly what we were looking for thanks!

...
Support/development 10 hours

Get a bigger amount of hours for more complex tasks and get a 10% discount

Buy now!
...
List Manager

Build different lists for your site

Buy now!