Here’s a fun CSS trick to show your friends: a large title that switches from a solid color to knockout text as the background image behind it scrolls into place. And we can do it using plain ol’ HTML and …
After just playing with apsect-ratio and being pleasantly surprised at how intuitive it is, here’s an example of CSS acting unintuitively:
…If you have a fixed element on your page, which means it doesn’t move when you scroll, you
position: relative creates a new context for absolute positioning within an element? Well, position: sticky is a locally scoped version of position: fixed. Let's take a look at how that works using a modal with a sticky close button as an example.
File this into a category of personal “CSS Ah-Ha Moments“.
The background-attachment property has never seemed all that useful to me. I have always looked at it as some sort of old school design trick from the GeoCities …
