>looking at clamp it smells of over engineered complexity. 3 arguments. difficult to visualise.
although you can use clamp to do complicated things that are difficult to understand, as is the case with all technology the simplest way to use it is quite clear.
(static minimum size you want for something, percentage of something, static maximum size you want for something)
thus width: clamp(100px, 80vw, 750px)
and now someone says well why wouldn't you just do min width max width etc. with that - no reason it's just nicer to have it one line to see IMO. But of course you can put clamp anywhere you can calculate anything so.
then you change your minmarg, margpercent, maxmarg as needed by normal css variable rules.
This should be an easy to understand system for a developer. It is easy enough for me to understand and visualize, and I suck at visualization.
This allows one to finally get rid of most breakpoints and say not just what the min and max heights and widths are of things but what the min and max and preferred margins, paddings, font-sizes etc. are of things - which without that IMO the max height and max width is just sort of stupid. But with that you can make designs flow and look good in a manner that can actually be described as 'responsive'
Now as I said - one can do all sorts of complicated and clever stuff on top of this sure. And if people do that they might end up with something that is difficult to reason about.
But if people can't reason about the margin example above then I think they should probably switch from Frontend development.
although you can use clamp to do complicated things that are difficult to understand, as is the case with all technology the simplest way to use it is quite clear.
(static minimum size you want for something, percentage of something, static maximum size you want for something)
thus width: clamp(100px, 80vw, 750px)
and now someone says well why wouldn't you just do min width max width etc. with that - no reason it's just nicer to have it one line to see IMO. But of course you can put clamp anywhere you can calculate anything so.
margin-left: clamp(20px, 5vw, 50px)
OR
margin-right: clamp(var(--minmarg),var(--margpercent), var(--maxmarg))
then you change your minmarg, margpercent, maxmarg as needed by normal css variable rules.
This should be an easy to understand system for a developer. It is easy enough for me to understand and visualize, and I suck at visualization.
This allows one to finally get rid of most breakpoints and say not just what the min and max heights and widths are of things but what the min and max and preferred margins, paddings, font-sizes etc. are of things - which without that IMO the max height and max width is just sort of stupid. But with that you can make designs flow and look good in a manner that can actually be described as 'responsive'
Now as I said - one can do all sorts of complicated and clever stuff on top of this sure. And if people do that they might end up with something that is difficult to reason about.
But if people can't reason about the margin example above then I think they should probably switch from Frontend development.
on edit: grammar change.