<el style="display:flex;justify-content: start;">...
? <el style="display:flex;justify-content: start;">...
?* media queries
* @apply
* low specificity (tailwind doesn't do !important)
EDIT: It "does" important, but only when instructed so, in 1.x it was a global switch, apparently since 2.x its available as a per-class modifier. Thanks dcre
* the theming abstraction
* brevity
https://tailwindcss.com/docs/just-in-time-mode#built-in-impo...
https://github.com/tailwindlabs/tailwindcss/releases/tag/v2....
Media queries are a good call out, they're definitely a benefit tailwind's approach has to the built-in browser support for inline styles. Another benefit is hover and focus states, which are very difficult to apply with inline styles.
<el class="[display: flex] [justify-content: start]">...
I wish I were being hyperbolic, but alas, no: https://tailwindcss.com/blog/tailwindcss-v3#arbitrary-proper...FWIW, I also hated using header files in C++ and also wrote a Ruby library for inlining all my tests immediately following the functions they test. I like having more context when looking at code without having to flip around from file to file to piece a bigger picture together.
If you haven't tried Vue yet, I strongly recommend it based on what you said.
It seems the biggest advantage most people find in tailwind is working around a react limitation.
Not much different than injecting an object in a `style` attribute in practice, but there's a lot of creative firepower in the arbitrary styles API.
With tailwind you can do “block md:flex hover:font-bold” and you’ve covered pseudo class cases and media queries very succinctly.