> rgba() and hsla() should not exist, rgb() and hsl() should have gotten an optional fourth parameter instead
That one got fixed without a time machine!
Mistakes in the Design of CSS (2013)
41–50 of 147 posts
Re: Mistakes in the Design of CSS (2013)
#42Earlier quoted context omitted.
In that case you probably want a `gap` of 20px, not a margin.
And this illustrates why margin as defined in CSS doesn’t really make sense at all. Outer margin is not usually a property of the element itself, but its container.
To be fair, it makes sense when you look at the use-case that spawned margins in the first place: , , , , etc... It does make for a fairly elegant way of handling all of those permutations with a reasonable amount of attributes. That comes in to play particularly in cases where you don't have control over which will show up in the wild (e.g. when dealing with Markdown content)
Re: Mistakes in the Design of CSS (2013)
#43There are even more fundamental mistakes in the concept of page styling. For example, that a webmaster should attempt to choose a readable font size and font colour on behalf of their users without knowing anything about the users' needs in that regard.
Re: Mistakes in the Design of CSS (2013)
#44Earlier quoted context omitted.
The designer doesn't work semantically. Working with tailwind is like digging the hole for a pool with a spoon instead of a bulldozer. They repeat the same tailwind classes 20,000 times and if the application gets bigger they repeat it 40,000 times and if they have to change the way it looks it is the mother of all cut and paste jobs. There is an unholy convergence of the tools being almost but not quite adequate, th…
Exactly. It's the frameworks driving the abuse. I actually think CSS is the wrong tool for modern webdev. Or rather, it should be the output of a compile process instead of something that designers and developers wrestle with. In general, we're building these complex SPAs, and still working directly in standards that were intended for a static document model. Part of the reason is we somehow believe we need infinite…
Maybe it is the properties that are good and the selectors that are bad. One could point to a trend in the last 15 years of HTML and CSS being tuned up as an application platform.
I'd point out the grid layout and flexbox as being features ideal for application work and https://www.w3.org/TR/2011/WD-html5-20110405/forms.html#form... is practically a love letter for applications.
Re: Mistakes in the Design of CSS (2013)
#45Earlier quoted context omitted.
Kind of hard to see Bootstrap and Tailwind so casually lumped together with regard to how they break semantics, as they are at least an order of magnitude apart in that. Bootstrap will throw in a p-0, but Tailwind is designed to essentially make everything a p-0. And that's an important distinction, as I think the current challenge with CSS for designers (and everyone) is that it now sits between design and developme…
The designer doesn't work semantically. Working with tailwind is like digging the hole for a pool with a spoon instead of a bulldozer. They repeat the same tailwind classes 20,000 times and if the application gets bigger they repeat it 40,000 times and if they have to change the way it looks it is the mother of all cut and paste jobs. There is an unholy convergence of the tools being almost but not quite adequate, th…
> Tailwind would be a lot more appealing to me if it was coupled with some system where I could say "class X inherits from tailwind classes A, B and C"
How is that different from:
D {
@apply A B C;
}
https://tailwindcss.com/docs/adding-custom-styles#using-modi...
Re: Mistakes in the Design of CSS (2013)
#46 The list-style properties should be called marker-style, and list-item renamed > to marked-block or something.
How about just `mark` instead of `marker-style` to be consistent with other properties that decorate part of an element like `border` or `background`?
Re: Mistakes in the Design of CSS (2013)
#47> background-position and border-spacing (all 2-axis properties) should take vertical first, to match with the 4-direction properties like margin. I hate that margin / padding short-hands, especially with 2 values, expect vertical first. In my head it's always (x,y) and (width,height) – always horizontal then vertical, I feel like it works like this everywhere else? Now my issue is that I've committed to memory that…
North East South West (never eat sour worms) not East South West North
That's actually a nice insight, I was so caught up in thinking in terms of screen space coordinates, it never occurred to me that it is based on cardinal directions.
It makes a fair amount of sense for the full shorthand with all 4 properties specified.
Re: Mistakes in the Design of CSS (2013)
#48Earlier quoted context omitted.
Exactly. It's the frameworks driving the abuse. I actually think CSS is the wrong tool for modern webdev. Or rather, it should be the output of a compile process instead of something that designers and developers wrestle with. In general, we're building these complex SPAs, and still working directly in standards that were intended for a static document model. Part of the reason is we somehow believe we need infinite…
Maybe it is the properties that are good and the selectors that are bad. One could point to a trend in the last 15 years of HTML and CSS being tuned up as an application platform. I'd point out the grid layout and flexbox as being features ideal for application work and https://www.w3.org/TR/2011/WD-html5-20110405/forms.html#form... is practically a love letter for applications.
Agreed on grid layout and flexbox. Took them a while to "fully" land, but now that they're here, they also represent a good model for visual design tools to work with as output.
Re: Mistakes in the Design of CSS (2013)
#49Earlier quoted context omitted.
North East South West (never eat sour worms) not East South West North
That's actually a nice insight, I was so caught up in thinking in terms of screen space coordinates, it never occurred to me that it is based on cardinal directions. It makes a fair amount of sense for the full shorthand with all 4 properties specified.
I actually don't think it makes any sense to base it on the cardinal directions! But it's easy to remember and I have no preferred alternative haha
Re: Mistakes in the Design of CSS (2013)
#50I thought "!important" was always about appealing to the emotions of overwhelmed and confused CSS authors as it seems to make the computer "listen to you" when it doesn't seem to be. I remember this notorious book https://www.amazon.com/Creating-Killer-Sites-David-Siegel/dp... about techniques used to get pixel perfect results with HTML back in the 1990s. The author of that book was quite impressed with CSS as it rea…
Well the `!important` is a good example if general misunderstanding of the core basics of the CSS: the cascade.
People usually think it means something like "override everything what was declared up until now in a way I don't need to check the selector specificity", while in reality it means *"teleport this certain declaration to the higher mirror cascade origin realm"*, what is way cooler yet mostly unknown concept of CSS.
There are _Browser_ styles, that are overridden by parts of —
— _User_ styles, that are overridden by parts of —
— _Author_ Styles, that are overridden by —
— !important parts of _Author_ Styles, that are overridden by —
— !important parts of _User_ Styles, that are overridden by —
— !important parts of _Browser_ Styles.
Sadly neglected concept of the web standards is that they were conceived not as rigid projectors of what authors create, but as a platform where individual user agents process authors' contents and negotiate the way how their users want to consume it. One of the first Håkon Wium Lie's CSS proposals even had some "weights" for individual attributes, so that user could express "I prefer serif fonts for headings this much" and author could express that "I suggest this sans serif font for heading with such weight, but it is not so important and my content will make sense in different font faces as well, but it is crucial that this particular text will be slanted, otherwise user would miss important aspect of information."