Recently, TailwindCSS released version 3.0 and the framework remains highly popular. Do you know all the little tricks for cleaner code?
...
For further actions, you may consider blocking this person and/or reporting abuse
Aspect ratio is cool, but the browser support isn't. If you are okay with supporting the very few latest versions, then fine, but I would not recommend using it just yet.
You're right only ~79% of browsers support the CSS aspect-ratio property. Luckily, there is a Tailwind plugin for aspect ratios which uses the padding-bottom hack. This is when insets become handy.
Aspect ratio plugin
Can I use aspect-ratio?
Thank you, didn't know about the plugin. I will definitely try it
Yep, dont forget about that important IE 11 :D
Fun fact: Last month i installed windows with ie 8 and for an hour i didnt manage to either update it to newer version, nor install firefox/chrome. Its so old SSL certificates, broken layouts and network issues made that impossible. I wonder hows life in the ie 11 land nowadays.
It is not about IE11, it is any browser before 2021...
Why care about browsers, when we can care about people.
I think flex spacing is also a good technique to know. Instead of spacing the children with margin classes like mr-5, you could space them at once using space-x-5 in the flex parent
+1, flex is great :)
space-x-5
is great.I found
gap-x-5
classes also helpful.Thanks for the tailwind tips!
A bit off topic, but you might be interested in tw-themes: which promotes color themes that are dynamically selectable at run-time, and automates your dark-mode through "shade inversion".
tw-themes.js.org/
At minimum, I would be interested in your thoughts :-)
Many thanks
your examples are so milquetoast not about anything pragmatic nor practical, not about something at all
I agree! Perhaps a more suited expert should write a thorough step-by-step guide with real life examples. Surely a more tautological approach would win. My life is too DRY for such a task. The intellects must devote their time for these child developers. Computational systems including ML/AI are fundamentally flawed without philosophical or sociological backgrounds. Why are we wasting our time on styling websites for consumerism?
with what does expert[0]ise honestly begin?
[0] https://twitter.com/RezistansM/status/1473325645216239617?t=_Jo8kZcEl90FGyZa5CraBw&s=19
Well played and well versed. I admit defeat.
there are also
space-[x/y]-*
utility which is perfect to adding gaps to non grid layouts - highly recommendThanks for sharing the practical tips. Inset Positioning is engaging.
Great article!
Good article!