I want to add rounded corners to my table in a react component using tailwind. I have tried using rounded-lg or any other rounded class to the component but it isn't working. What can I do? "use client"; import {…
I have this down arrow image, which rotates to an up arrow when the boolean "open" function switches, with a transition effect. <img src="./downArrow.png" className={`${(open) && "rotate-180 transition-all"}`} /> But when I try to close the container, the arrow goes…
I am using this tailwindcss and i want to use the same css on the react-select Select tag. className="block w-full px-3 py-2 rounded-md border border-gray-300 text-gray-700 focus:ring-indigo-500 focus:border-indigo-500" This react-select Select tag is working (I am using version 5.8.0): <Select…
I tried using Justify on my tailwind flex but it isnt working I tried refreshing the page, deleting browser history then refresh, try all of the flex (the justify, justify items, align, align items, etc) <main class="flex-grow text-slate-900 font-kadwa bg-stone-200">…
Let's say I have a h1 tag like this: <h1 data-position="left" class="data-[position=mid]:animate-fade-out">content</h1> How can I use tailwind(maybe with some not operator based on my last search results but I still don't know how) to do animate-fade-in when position is not…
I'm really struggling with working out how to make each element of the grid sticky on horizontal scroll. I've tried so many combinations but the {date} is never sticky. I've tried adding overflow-x-scroll to the parent, and changing items-baseline with…
I am sending a tailwind color green-500 from the prop bgColor and then use it inside the after:border-b-${bgColor} in the positionStyles object. But tailwind is unable to dynamically parse after:border-b-${bgColor} as a tailwind class. How to solve this issue? I…
Today I have encounterd a problem in css. I created a div named as main and its childrens is nav and box, in the box i have putted some content. when I fixed nav applying its poistion in css as…
I'm trying to extend tailwind backgroundImages and no matter what I put as the image's path it doesn't recognize. I tried search for the answer and wasn't able to figure out. I'm using vite in this project. tailwind.config.css /** @type…
I am trying to make a flexbox that shows four logos, and aligns them in the middle of the website. I tried this code: <div class="text-lg text-ODS-600 bg-ODS-100 rounded-lg p-2 text-center font-bold"> <p>Thanks to:</p> <div class="flex justify-center"> <div class="flex flex-col…