I have installed tailwind successfully. When it comes to using the @apply, things are not working. <body> <!-- header --> <header class="bg-transparent absolute top-0 left-0 w-full flex items-center z-10"> <div class="container"> <div class="flex items-center justify-between relative"> <div class="px-4"> <a href="#home"…
I'm new to Tailwind CSS (first project) and I feel like I'm missing a basic step in getting my Tailwind to work properly. I have my Project Folder Structure: Lesson01 build (folder) css (folder) style.css …
HTML CODE <div class="flex justify-center"><p class="font-bold text-[58px]">Title</p></div> <div class="grid grid-flow-row row-span-4 gap-[90px] mt-10"> <div class="grid grid-flow-col col-span-2"> <a href="#"><img class="h-[235px] w-[395px] bg-slate-50 rounded-[30px] relative left-[80px] border-2 border-black hover:rboxshad" src="./images/sz2.png" alt="img-sz"></a> <div class="h-[145px] w-[650px] rounded-[30px] relative top-[90px] right-[225px] bg-[#F0F0E1] border-2 border-black…
I'm trying to apply radial gradient in Tailwind but facing some issues. This's what I've tried tailwind.config backgroundColor: { 'radial-gradient': 'radial-gradient(169.40% 89.55% at 94.76% 6.29%, rgba(0, 0, 0, 0.40) 0%, rgba(255, 255, 255, 0.00) 100%)', }, and use it like…
Here is a snippet of a basic breadcrumb using Tailwind: <link href="https://cdn.jsdelivr.net/npm/tailwindcss/dist/tailwind.min.css" rel="stylesheet" /> <div class="max-w-md"> <ul class="flex items-center"> <li class="flex items-center"> <a href=""> <svg class="h-5 w-5 flex-shrink-0" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439…
I am using Tailwind with Headless UI for my react project. I am having a display issue for Headless UI Menu as shown i the below images - Correct display - Problematic display - The menu is open but not…