I have a React component called Buttons and as the name suggests, this component is used for all the buttons in my project. In order for this component to be completely dynamic, I decided to get the background color of…
I am working on my first app in React Native and am using the android emulator. When I run npx expo start and run the code, I am getting this error (See attached image). I am running the latest version…
Please see this playground https://play.tailwindcss.com/SMkXmO9Mo8 As the text say I want the grid row items to distribute evenly and edge to edge in a container with flexible width. justify-content: space-between; or tailwinds justify-beween has no effect on grid only flex.
I have the following code in my layout: // Fontawesome import { config, library } from '@fortawesome/fontawesome-svg-core'; import { fas } from '@fortawesome/free-solid-svg-icons' import { far } from '@fortawesome/free-regular-svg-icons' import { fab } from '@fortawesome/free-brands-svg-icons' library.add(fas, far, fab) config.autoAddCss =…
I am having a difficult time trying to style a td element which has a div that has a class called 'check' as its child element. I am trying to style it from div element which is the parent of…
As you can see in the code snippet below, I have tried all 6 of Tailwind's justify and align content, items, and self properties as well as flex justify-between on the parent and still not managing to get the desired…
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 have the following code: <h2> Where ever you go <br/> i am there. </h2> On mobile screens I dont want the <br/> to enforce line break. Any idea how to achieve this using Tailwind CSS? I tried using multiple…
Is it possible to combine nth-child and hover in tailwind? <tr key={i} className='[&>*:nth-child(even)]:bg-[white] hover:bg-[#6b7280] [&>*:nth-child(odd)]:bg-[#eee] hover:bg-[#6b7280]'> This is what i currently have, but now hover does not work, without the even rule, only the odd columns get changed on hover…
There are several lines text with dot. I tried to use whitespace-pre-line, but it didn't work. This is the code <div className="flex items-center group" > <p className="px-6 py-3 rounded-b-lg rounded-r-lg bg-gray-800 w-[28rem] max-w-xs lg:max-w-md text-gray-200 whitespace-pre-line"> Hello @Green Greetings from…