Questions tagged [tailwind-css]
Tailwind CSS is a highly customizable, low-level CSS framework that gives you all of the building blocks you need to build bespoke designs without any annoying opinionated styles you have to fight to override.
tailwind-css
9,965
questions
0
votes
1
answer
12
views
How to dynamically adjust container heights in a flex layout using Tailwind CSS and React?
I'm working on a React application where I have multiple pricing cards (PricingCard) rendered using Tailwind CSS for styling. Each card consists of several sections, including a bullet points section (...
0
votes
0
answers
16
views
How to change Background color of AgGrid Table dynamically?
In Navbar Component, there are select tag with two options "light" and "dark" if i select dark option then I am setting this value in localStorage and localStorage value updating ...
0
votes
2
answers
20
views
Tailwind: How align text in container with no-full-width parent?
I'm using tailwind and I have a problem. I have the next code:
<div class="container mx-auto">
the in the right position
</div>
<div class="bg-cyan-300 w-10/12 lg:w-9/...
-1
votes
0
answers
19
views
TailwindCSS creates huge CSS file [closed]
I have a NextJS project. I am using TailwindCSS. I have setup post CSS as following (postcss.config.js):
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};
The problem ...
0
votes
0
answers
17
views
laravel to use tailwind classes on all my pages
It is a small laravell app, I modified the tailwind.config.js file like this:
export default {
darkMode: 'class',="dark">
and the app.blade.php file like this:
<html lang="{{ ...
0
votes
0
answers
14
views
How can I increase the width of the Password PrimeReact component
I'm using PrimeReact to do my front-end components and i can't change the width in the password component, but in the TextInput component is working.
Code:
'use client'
import CPFInput from "@/...
-5
votes
0
answers
30
views
How can I transition height: 0; to height: auto; using tailwind CSS? [closed]
I'm trying to implement a dropdown menu with smooth open and close transitions using Tailwind CSS in a Next.js application. Currently, I have the following structure:
<div className={`flex items-...
0
votes
0
answers
8
views
Html2canvas push text outside of con
I have a simple div with a paragraph in it.
when the pdf is generated, the paragraph is pushed down outside the div
I'm also using DaisyUI
<div class="bg-blue-50">
<p class=&...
0
votes
0
answers
10
views
fixing items at the start of the container without padding margin
i want to fix my items at the beginning of the container when the screen size is set to medium the item should cover the whole width.and be able to adjust when screen size is set to normal.Am using ...
0
votes
0
answers
21
views
Why Tailwind CSS doesn't works with public/*.html files in my Ruby on Rails project
I'm using Tailwind CSS for my Ruby on Rails project, the CSS works fine with all the layouts in views but it doesn't works with public/*.html files in my project.
I have a 404.html page and a 500.html ...
0
votes
1
answer
22
views
Why are these elements shrinking vertically even though they have h-20 and shrink-0?
In the follow code, I have divs like this:
<div class="border-border h-20 w-full flex-1 shrink-0 rounded-full border bg-[#ffffff] md:w-auto"></div>
On mobile, they shrink ...
1
vote
1
answer
42
views
Cypress component testing fails because of tailwind
I am trying to do some component testing with Cypress and I can't get it to work, I am always getting an error.
I think this is happening because Tailwind is not set up correctly. I tried following ...
0
votes
1
answer
23
views
remove empty space from -translate-y using tailwind css
I have an issue where there's empty space in my profile container which I'd like removed from the
profile container
<div className='h-auto w-[650px] z-10 rounded-xl' style={{ backdropFilter: `...
0
votes
2
answers
29
views
NextJS 14 Next Image fill property not working with tailwind css
I am using Next JS 14 and Tailwind CSS
If I use fill this is code:
"use client";
import React from "react";
import { motion } from "framer-motion";
import Image from &...
-3
votes
0
answers
19
views
Snap causing issue with Scrolling [closed]
So the issue is the screen moves back up if I have scrolled really hard and have not reached to the other section. But it stops when scroll bit by bit. I believe it is due to the snap property, and ...