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
10,000
questions
-1
votes
1
answer
25
views
Why the hover class is not working on tailwind?
I'm trying to style a button with tailwind on Next.js.
I want the button background color to change on hover.
I'm trying to style a button doing something like this
<button className="rounded-...
-1
votes
0
answers
22
views
Images not displaying with correct source
I wanna display two images and some logos, also some bottom icons but no image is on screen whatsoever, also there's no error. I can't see what I'm doing wrong.
All the assets are exported in a file ...
- 142
0
votes
3
answers
48
views
JS not opening a button as intended
I'm working on a header section in HTML and decided to learn JavaScript in this project. I'm also using TailwindCSS, with a few specifics I included in a different .css file.
I got the JS code from ...
- 1
-3
votes
0
answers
24
views
I want to change the color of the body, but it takes up the entire screen [closed]
I'm creating a web page about a weather app, but I have a problem with the background-color of the body.
I gave the bodysuit the background color #191a38.
Inside the body I have a main with the ...
0
votes
0
answers
18
views
Tailwind CSS Styles Not Applying Automatically in React Project
I'm working on a React project and have integrated Tailwind CSS for styling. However, the Tailwind CSS styles do not apply automatically when I make changes to my CSS or component files. I have to ...
0
votes
0
answers
15
views
Blended in background color's opacity does not change with bg-opacity
<html lang="en">
<head>
<meta charset="utf-8" />
<title>humhum</title>
</head>
<body
class="min-h-...
1
vote
0
answers
62
views
Tailwind CSS and Next.js: Local Images Not Rendering with Pseudo Elements
I'm working on a project using Tailwind CSS and Next.js. Despite extensive research, I've encountered an issue I can't resolve.
The Problem:
I am trying to use pseudo-elements ::before and ::after to ...
- 11
-1
votes
0
answers
47
views
Is it possible to absolute position a container to the left of a scrollable container [closed]
My issue is that I have code similar to
<div style={{ display: "flex" }} className="App">
<div
style={{
height: "100vh",
width: "200px&...
- 63
0
votes
1
answer
39
views
How do I extend the peer- modifier in Tailwind to allow it to work on any sibling?
I would like to extend the peer- modifier in Tailwind such that when I write this:
<div class="peer peer-hover:opacity-50"></div>
<div class="peer peer-hover:opacity-50&...
- 2,574
0
votes
0
answers
16
views
Disable browser/page navigation while horizontally scrolling iframes?
My site has a container of iframes placed side-by-side, which creates a horizontal scroll. When users use a two-finger gesture/trackpad scroll outside the iframe, it scrolls as expected. However, when ...
- 1,746
0
votes
1
answer
17
views
Tailwind width transition for non specific values
I got a button styled with Tailwind and Vue js 3. This button contains a classic "Login" text. I want to achieve that when the user clicks and a loading status is triggered, the button ...
- 109
1
vote
0
answers
18
views
Tailwind CSS Grid doesn't seem to be working properly while using Nextjs. Somtimes works with 4 cols, sometimes doesn't
I was working on this project where i had to use grid on a small component.
Main div :-
import Feature from "@/components/Feature";
export default function WebsiteFeatures () {
return (
...
1
vote
2
answers
44
views
tailwindcss background not changing to correct color
There is a feature i implemented in the tiktaktoe wherein if a player wins the game, then the winning box gets green in color and if there is a draw , then all the box becomes red. The feature is ...
0
votes
0
answers
28
views
How to make a tooltip for a column in a table if the text in the column is larger than 250 pixels
I am using tailwind and shadcn for development.
My idea is that if the text in a column is larger than a certain number of pixels, it should be possible to see a tooltip from the shadcn library for ...
- 81
0
votes
0
answers
20
views
tailwindCSS not working in nextJS and Shadcn project
None of the tailwind classnames are working in this project.
I have one of each file like components.json, globals.css, and tailwind.config.ts, and the globals.css is imported in the layout.tsx file ...
- 385