FilamentPHP Glow Filament Glow
beta
  • All Tricks
  • About
login
logo dark logo light

Make Filament table Headers sticky using CSS

Image Description
By: Prageeth Peiris
  • Published: 25 Oct 2024 Updated: 25 Oct 2024
Tables

Make Filament table Headers sticky using CSS

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}

Back to Tricks
logo dark logo light

Related Tricks:

Demonstration of using a resource for multiple typical models

how to use a resource with multiple models

Make Filament table Headers sticky using CSS

Quick Filter Above the Tables

Add a Quick links to activate table filter on FilamentPHP table

Implementing Row-Level Security in Filament Tables with applyRowAccessPolicy

Learn how to implement row-level security in Filament tables using the applyRowAccessPolicy macro that filters query results based on user permissions through Laravel's policy system.

Globally Translate all Components

make all Field or any components translatable

Tweet
X GitHub RSS Feed
built with ❤️ using
filamentPHP
© 2026 Lara Zeus. All rights reserved.
Terms and Conditions Contact Us

Syntax highlighting by Torchlight .

FilamentPHP Glow Filament Glow
beta
    • All Tricks
    • About

Media Picker

  • No Files in the library or nothing found for your search.

Add Files

File