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,022
questions
361
votes
28
answers
348k
views
How to add a @tailwind CSS rule to CSS checker
Tailwind CSS adds a @tailwind CSS at rule which is flagged as unknown.
How can I avoid this error?
For example, styles.css
@tailwind preflight;
@tailwind utilities;
- 5,821
237
votes
6
answers
338k
views
How to use calc() in tailwind CSS?
I have this html:
<div class="container h-screen w-screen">
<div class="navBar h-7"></div>
<div class="content-container"></div>
...
- 3,229
156
votes
14
answers
313k
views
Vertical align with Tailwind CSS across full screen div
How can I vertically align a div with Tailwind?
What I want:
-----------------------------------
| |
| |
| |...
- 4,148
141
votes
8
answers
202k
views
How to access all the direct children of a div in tailwindcss?
I have this html:
<div class="section">
<div class="header">header</div>
<div class="content">
<div>sub contents 1</div> ...
- 2,601
119
votes
26
answers
170k
views
Error: PostCSS plugin tailwindcss requires PostCSS 8
I installed the new tailwindcss version 2.0 and I've got the following error. I tried to uninstall postcss and tailwindcss but it does not work.
error in ./src/components/util/SlideInfo.vue?vue&...
- 1,311
115
votes
19
answers
189k
views
Tailwindcss: fixed/sticky footer on the bottom
I use tailwindCSS and confront a problem with make footer.
base.html
<body>
{% include "partials/nav.html" %}
{% block content %}
{% endblock %}
{% include "partials/footer....
- 2,475
100
votes
2
answers
118k
views
How to make parent div activate styling of child div for hover and active
I made this style for side bar navigation
I made a box and used transform to hide it on the left side, to get the curved border effect.
On hover, active etc
Border button -> bg-green-300
text-...
- 1,580
90
votes
42
answers
156k
views
My TailWind CSS Intellisense plugin just isn't working on my VSCode
So the description of the plugin is that it'll display suggestions of classes when am working on the markup, but it doesn't. I've reloaded the plugin countless times. I even restarted vscode and ...
- 909
89
votes
5
answers
116k
views
How to use :not() in tailwind.css
I recently started to give tailwind.css a try in my Nuxt project. so I needed to use :not(:last-child) pseudo-elements but I don't know how.
<ul>
<li
v-for="(item, index) in ...
- 1,050
89
votes
14
answers
108k
views
Dynamically build classnames in TailwindCss
I am currently building a component library for my next project with TailwindCss, I just ran into a small issue when working on the Button component.
I'm passing in a prop like 'primary' or 'secondary'...
- 1,644
85
votes
6
answers
168k
views
Can't center absolute position (Tailwind.css)
Background & Problem:
I'm using Tailwind CSS and Alpine.js for a simple search bar that has a dropdown positioned using absolute
Codepen here: https://codepen.io/jdonline/pen/YzXpbyJ
When I ...
- 1,163
84
votes
7
answers
58k
views
Storybook-tailwind. How should I add tailwind to storybook
I want to add tailwind to storybook. So that Stories will render just like it will render on web.
I used create-react-app project-name --template typescript to create the project.
Then to install the ...
- 1,003
82
votes
8
answers
186k
views
Add both !important & selector strategy for tailwind configuration
I have got the CMS application with bootstrap, and embedding react application with tailwind css into it.
There are clashes with both css framework util classes.
I enabled !important via tailwind ...
- 1,259
81
votes
11
answers
181k
views
How to use CSS variables with Tailwind CSS
Is it possible to use CSS variables with Tailwind CSS?
For instance, let's say I have these variables:
--primary-color: #fff;
--secondary-color: #000;
And I would like to use them in Tailwind like so:...
- 1,461
79
votes
10
answers
217k
views
How to fill the height of the viewport with tailwind css
I'm just trying out Tailwind CSS and want to know how to fill the height of the viewport.
Taking this example HTML from the docs
<div class="flex items-stretch bg-grey-lighter">
<div ...
- 3,795