Check out a free preview of the full Dynamic CSS with Custom Properties (aka CSS Variables) course

The "Wrapping Up" Lesson is part of the full, Dynamic CSS with Custom Properties (aka CSS Variables) course featured in this preview video. Here's what you'd learn in this lesson:

Lea wraps up the course by answering a student's question regarding why CSS knows it's viewport values, but not its scroll position and providing some personal and social links.

Preview
Close

Transcript from the "Wrapping Up" Lesson

[00:00:00]
>> Do we have any more questions?
>> It's a bit weird that CSS doesn't know its scroll position, come to think of it as it knows its viewport.
>> See, that's the thing, If CSS knew it scroll position that would introduce cycles. So it's one of those examples of these features, that we would love to add.

[00:00:17]
But it's not feasible right now because we can't think of a way to get around this. Let's say there was a scroll x keyword that you that allowed you to get the horizontal. And the scroll y that allowed you to get the vertical scroll position through CSS. What if you wrote some CSS that actually modifies these positions by making the element longer for example.

[00:00:39]
Or introducing some padding, introducing all sorta things, so we want in general, it's a design principle of CSS. That we wanna avoid these cycles, we don't want you to be able to write CSS that counsels itself. If that makes sense, so your CSS can get access to the viewport dimensions, because the CSS cannot modify the viewport dimensions.

[00:01:01]
But CSS could easily do things that would modify the scroll position and we don't want that. Because that basically would give you the same effect that you do, have you ever tried doing display non on hover. And then you hover over an element and it just flickers, this is the kind of thing that we want to avoid today, we do not want these kinds of cycles.

[00:01:23]
So that's the problem right now, and even container queries were not feasible for a long time. Because of this problem, but they found a way around it Miriam, Suzanne, and some other people found a way around it. And that's why we're getting container queries now but it took many years of developers asking for them.

[00:01:43]
And basically, we could not find a way to do it cycles are a big problem, when adding new features to CSS

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now