N
Nuxt2y ago
LazyDali

Tailwind preventing basic HTML tags to render properly

Hello, I am having a strange issue with Tailwind in a Nuxt 3 project. The installation and configuration was done following https://tailwindcss.com/docs/guides/nuxtjs. Tailwind classes (as well as my theme extension custom classes) display properly but for an unknown reason, some of the root HTML tags are not rendering properly (as shown in the image attached). The HTML tags render properly when I disable Tailwind. Anyone has a clue of how to solve this? Here's my stack: "@nuxtjs/tailwindcss": "^6.1.3", "nuxt": "3.0.0"
No description
2 Replies
danielroe
danielroe2y ago
I think it's likely just the tailwind reset which is deliberately removing the browser's default styles
LazyDali
LazyDaliOP2y ago
OMG! Thanks @danielroe your explanation led me to a feature I wasn't aware of from Tailwind. The Preflight (https://tailwindcss.com/docs/preflight#headings-are-unstyled). I disabled it and the basic tag CSS properties were back. Knowing this is not a config issue, I can now enable it and define each property as per my client theme requirements. Thanks!
Preflight - Tailwind CSS
An opinionated set of base styles for Tailwind projects.
Want results from more Discord servers?
Add your server