Why does tailwind have so few default options for min-width?
I'm getting into using tailwind and so far I've found it far easier to work with than css-in-js or other solutions I've tried in the past. However, I'm wondering why there are so few default options for
min-w-*. It kinda makes me think I'm doing something wrong.
For example, I have a page with some user generated rich text. I want this to have a max-w-prose so that the lines are always readable. However, on larger screens when the user hasn't entered much text, the rich text area is extremely narrow.31 Replies
1. If you want some specific
min-w- you can use arbitary value for example min-w-[69px].
2. to target larger screens you can use lg: for example your div or whatever has something like min-w-prose lg:min-w-[500px]cant you just use
w-full max-w-whatever?you can also try unocss where you won't have to do this weird syntax of the boxes, i.e. []
and it is faster, more optimized and has more features
i understand that. i was more just wondering why max-w has for instance
max-w-1/2 and max-w-3xl and these dont exist for min-w
ok. yeah that makes sense for this use case definitelybecause the point of tailwind is to lead people towards good design decisions
and not giving classes for everything is part of that
custom values are there for when you need them, but usually using them means you should be reconsidering your layout
ima be honest chief.... i cant keep up with every new framework that comes out for solving every problem. thats kinda why i was excited when i found t3 stack: someone had already picked good solutions that worked for most problems and werent deprecated, badly maintained, buggy, etc. I just googled unocss and it looks nice but it seems very similar
i guess thats what im really asking. why is it not good practice to use set sizes for min-width?
fwiw you don't need to use it, just giving you an option. it builds on tailwind and makes it better. but that doesn't mean tailwind is bad, its very very good
what unocss does different is that its on-demand classes, so for example min-w-3xl can exist in uno
it will generate the css for that class for you
its infinitely better than the css-in-js solution i had cobbled together.... i had written this whole app on mui's makeStyles() api, which is now deprecated and didnt work with some of the newer things i wanted. so i kinda made a shim to backport it so my existing styles worked. now im about 2/3 of the way thru redoing everything in tailwind
ok. got it. that makes sense
because min-width usually only makes sense for stuff like keeping buttons consistent
for big stuff you can use breakpoints with fixed widths, or 100% with a max
you'll figure out why a big min-width is usually a bad idea when you have to modify a bad layout that uses this pattern
yeah im trying to pick up as much about how to do layouting from youtube and stuff but i havent heard anything about this
youtube is fairly worthless for this stuff tbh
the only ways to learn much are building stuff yourself, and inspecting good sites
yeah well i am building this thing, but its hard to just figure out best practices on youer own
find a site that does a similar thing and look at how they did it
i steal most of my css
another way to learn best practices (what i did) is just post your project in a lot of discord servers, ask for feedback
and when you steal enough, you figure out the patterns that work
people are more than happy to give constructive criticism on whatever stuff you are doing
do you usually just like post a link to a page? or the css code itself?
i just post the github repo and a deployed link
if im asking for help/asking for a better way then i will post the relevant code
im getting to the point where it would be really nice for more general feedback
so maybe ill do that
i can try stealing more too
yes you'll level up way faster if you just ask people
also while stealing, try to type it out not just copy paste it
that way you'll understand it more and what you're exactly doing
yeah i always do that
good stuff 👍
is there a channel here for that kind of thing?
there's #showcase in this server
a lot of other servers have similar channels to share projects
i got timed out once for putting a question in the techncical-discussion channel 😛
ok good to know
ill p[ost there in a couple days or so
https://t3-true-finals.vercel.app/
if anyones interested
its gunna be open source, but the codes not..... good enough..... yet
don't worry about code not being good
ill try 😛
@nexxel, how is it faster? Don't they both just compile into a .css file? Do you mean faster to build?
yes and more minified afaik
it also supports css splitting ideal for MPAs
https://github.com/unocss/unocss#features