#316·starlight

Sticky navigation consumes too much vertical space when zoomed in

Author: theetrainCreated Jul 8, 2023Updated Feb 17, 2026
Labels🌟 core🤩 a11ylayout

What version of starlight are you using?

Haven't used yet

What version of astro are you using?

Haven't used yet

What package manager are you using?

npm

What operating system are you using?

macOS

What browser are you using?

Chrome

Describe the Bug

Starlight, as well as the Astro docs, have a large sticky navigation header that consumes a lot of vertical space. Occasionally, I prefer to zoom in when reading any documentation, and as a consequence I have a lot less room to read than I would otherwise if the navigation header wasn't fixed.

I'm interested in Starlight, though I would like to see this navigation treatment improved; either to keep it at the top of the page, or auto-hide as I scroll down. Check out how navigation is handled on the new Svelte website on desktop and mobile: https://svelte.dev/

Here's a reference with some more considerations: https://adamsilver.io/blog/the-problem-with-sticky-menus-that-appear-on-scroll-and-what-to-do-instead/

And a screenshot of my typical reading experience:

image

Thanks for reading!

Link to Minimal Reproducible Example

No response

Participation

  • I am willing to submit a pull request for this issue.