
Make Filament table Headers sticky using CSS
By: Prageeth Peiris
- Published: 25 Oct 2024 Updated: 25 Oct 2024

Add this css to your theme.css file
1div.fi-ta-content{2 @apply h-screen;3}4 5 6table.fi-ta-table th{7 @apply sticky top-0 bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-200 dark:border-gray-700;8}

Related Tricks:
Quick Filter Above the Tables
Add a Quick links to activate table filter on FilamentPHP table
Add tooltip to table header column macro
Reuse action in both Table and Header
how to use an action as a headerAction or as a table row action without code duplication
Globally Translate all Components
make all Field or any components translatable
Make Filament table Headers sticky using CSS