IndieWeb Challenge Day 7
A sticky navigation menu
For ages, I have wanted the navigation menu at the top of the page to remain visible even after you have scrolled down past the bottom of the screen, which pushes the menu up off the top of the screen. In principle, that's supposed to be much easier now that you can use CSS to position an element as
<sticky>. But it proved trickier than I expected
I've done it, as you can see, but had to sacrifice the image of umbrella pines that used to grace the top of each page. I just could not figure out how to get the navigation menu to stick to the top of the page while allowing the image to slide on up. I got to the point of realising that it depends on which element is inside what, but after a couple of hours of experimentation, I was not able to make it behave as I wanted.
So I have a sticky menu, but I don't have a picture, and while I warm to the greater minimalism -- the image serves no purpose other than decoration -- I quite liked the look of it before, as a reflection of my environment.
Adding it back can be a project for another, less busy day.
Webmentions allow conversations across the web, based on a web standard. They are a powerful building block for the decentralized social web.