I am working with Tailwind CSS in a Nextjs project. I have tried a simple heading but styles are not being applied. Here is my full code on GitHub: https://github.com/mennaElbadry70/TailwindCss_practice I have checked the tailwind.config.ts file but the paths should…
I am using the TailwindCSS grid function to show the stats and their value. I want to know how to decrease the distance/gap between the state and its value so that I can bring them closer to each other. <script…
I am trying to clone eat-curious website for personal practice. But here I am stuck at the drooling yet? section. I tried understanding the code in developer console, where i got the svg for drooling yet text. So this is…
When using tailwind (example, setting height as per documentation here - DOCS), we have predefined values as such h-40 height: 10rem; /* 160px */ h-44 height: 11rem; /* 176px */ but the in between values in the range of 160px…
when in pc screen it shows full width but when switch to mobile it is not full width looks like it's width is 80-90% also my constent is overflowing outside so it is not so responsive on mobile whyy [enter…
I'm learning tailwind and I have this div : <div class="mt-5 border border-gray-300 p-2 bg-gradient-to-b from-gray-100 via-purple-50 to-gray-50 rounded-lg mb-8 p-4 dark:bg-black"> And in dark mode my background is still the original gradient (my dark mode is working) I want…
I am learning tailwind and i am new in it. When I try to create multiple html files in a folder and try to apply tailwind, it is applying the property only to the first html file i have created.…
i have a project on my laptop using tailwindcss cli, it goes right on my laptop, but when i upload it to github pages it wont work like it never have css or anything, i allraedy reupload it but still…
I used text-[20px] in <Badge/>, but it's overridden by another css class, how can I override tailwind the class <Badge label="1" className='w-[30px] h-[30px] p-6 ml-4 text-[20px]' style={{ lineHeight: '20px'}}> 1 </Badge>
In a sentence: Why does calculations with JS variables does not apply any style using TailwindCSS v3? I am using VueJS for my project, and this example works as expected as it simply applies calc as string: ... <div class="w-[calc((100%-12rem)*2/3)]">…