Joana Borges Late
2 min readMar 22, 2023

--

Thanks for your reply!

I am so glad because you wrote "CSS is complicated"!!! Hearing "CSS is very simple, you just need to study it during 4 or 5 hours!" always scares me a lot!

You { This is not counterintuitive. It literally follows the exact same logic that you cited above “For all programming languages… what matters is the order of the calls to the functions.” }

About being counterintuitive or not: First, I have to respect the intuition of each person - we are in the realm of the subjectivity. That being said...

I keep what the article shows: CSS uses exactly the *opposite* logic than any other language (that I know). For CSS what matters is the order in which we "declare" (write) the rules. And this reversed logic is highly counterintuitive for whom have learned other languages.

Forgetting the intuitive-or-not subject. For sure, this CSS reversed logic makes it "very easy to write confusing rules that don’t do what you think they should", like you said.

You { When you set a class (or use any other selector) you aren’t calling a function you are setting a flag that the rules engine will use to apply the rules you previously defined. }

Exactly! What I propose is setting flags in a similar way to what we do in a procedural (functional/OPP/event based) language.

Even in HTML - although, having a very different syntax, each declaration (tag) happens in one place only.

If you take a second look, you may realize that what I am really proposing is *just using a SUBSET of the CSS* (which is the same thing that I do in my daily JavaScript).

About stack-based-engine/cascading rules: I think I understand it. I cascade imaginary layers. I hope you don't mind if I paste part of the section "Molecular CSS — the third principle" here:

WE ORGANIZE THE MOLECULES IN IMAGINARY LAYERS, considering who overrides and who will be overridden.

Inside the same layer, no molecule overrides the other. Any molecule can only override a molecule of a previous layer.

--

--

Responses (1)