Chris Coyier
@adactio re: adactio.com/links/16470 and your universal rule idea, see @MiriSuzanne’s comment: css-tricks.com/fixed-headers-… (Will this turn into a webmention?)
Fixed Headers and Jump Links? The Solution is scroll-margin-top | CSS-Tricks
I didn’t know about scroll-margin-top! I wonder if you could apply a universal rule …like, say you’ve got a fixed header that’s 2em in height, couldn’t you declare:
:target {
scroll-margin-top: 2em;
}
Responses
Related links
Designing better target sizes
This is a wonderfully in-depth interactive explainer on touch target sizes, with plenty of examples.
Revealing ‘back to top’ button
Such a clever minimalist use of CSS!
The perfect link - The A11Y Collective
How do we write, design, and code a link that works for everyone on every device? Let’s dive into the world of creating the perfect link, without making a pig’s breakfast of it.
Line heights in CSS work better with ratios | Andy Bell
There’s a broader point here about declarative design:
Setting very specific values may feel like you’re in more control, but you’re actually rescinding control by introducing fragility in the form of overly-specific CSS.
Related posts
Making the website for Research By The Sea
Having fun with view transitions and scroll-driven animations.
Cascading Style Sheets
The terminology of applying CSS.
Everything You Know About Web Design Just Changed by Jen Simmons
A presentation at An Event Apart Seattle 2018.
Sticky headers
A few things to remember if you’re going to using position:fixed.