F
Filament5mo ago
fpolli

Tailwind ignoring classes

I am making a custom view page and trying to use some tailwind classes. On a div I have this:
class="grow-0 shrink-0 w-[32%] basis-[32%] px-3 py-2 text-center font-semibold"
class="grow-0 shrink-0 w-[32%] basis-[32%] px-3 py-2 text-center font-semibold"
Some of the classes are applied, but others (grow-0 and the arbitraries) are not applied. They are ignored. I added a tailwind.config.js file in my project root and defined content:
content: [
"./resources/views/**/*.blade.php"
]
content: [
"./resources/views/**/*.blade.php"
]
The only suggestion I have found from a search is the content path.
4 Replies
Illizian
Illizian5mo ago
I think you'll need a custom theme. As if you're using panels then it only pulls in the stylesheet that it has published to /public/vendor
fpolli
fpolliOP5mo ago
oh when I was reading on custom themes recently, there is an issue with Filament 3 not supporting Tailwind 4, but requiring Tailwind 4 in the package.json.
Dennis Koch
Dennis Koch5mo ago
Filament doesn't require Tailwind 4. It's included in the default Laravel install. You can downgrade if you don't need it or follow the instructions during theme creation.
Zep Fietje
Zep Fietje5mo ago
If you’re still looking to use Tailwind CSS v4 outside Filament in your Laravel application, I just posted a guide on how to achieve that. You might be interested in checking that out, and feel free to mention me here if you have any further questions 😊 https://filamentthemes.com/guides/how-to-use-filament-with-tailwind-css-v4
How to use Filament with Tailwind CSS v4
Laravel 12 ships with version 4 of Tailwind CSS, while Filament v3 only supports version 3. This guide walks you through setting up Tailwind CSS v3 alongside v4.

Did you find this page helpful?