Link tags: height
13
Sizes=”auto” pretty much requires width and height attributes — ericportis.com
Huh! I did not know this. Good to know!
Space Elevator
Scroll up to the Kármán line.
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.
My Custom CSS Reset
This CSS reset is pleasantly minimalist and a lot of thought has gone into each step. The bit about calculating line height is very intriguing!
The Thing With Leading in CSS · Matthias Ott – User Experience Designer
An excellent explanation of the new leading-trim
and text-edge
properties in CSS, complete with an in-depth history of leading in typography.
(I’m very happy to finally have a permanent link to point to about this, rather than a post on Ev’s blog.)
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;
}
8 DOM features you didn’t know existed - LogRocket Blog
If you ignore the slightly insulting and condescending clickbaity title, this is a handy run-down of eight browser features with good support:
- extra arguments in
addEventListener()
, scrollTo()
,- extra arguments in
setTimeout()
andsetInterval()
, - the
defaultChecked
property for checkboxes, normalize()
andwholeText
for strings of text,insertAdjacentElement()
andinsertAdjacentText()
,event.detail
, andscrollHeight
andscrollWidth
.
Type in the digital era is a mess
Marcin explains why line height works differently in print and the web. Along the way, he hits upon this key insight about CSS:
Web also took away some of the control from typesetters. What in the print era were absolute rules, now became suggestions.
Remember that every line of CSS you write is a suggestion to the browser.
The Equilateral Triangle of a Perfect Paragraph | Better Web Type
This is a fun game (I scored a measly 73/100). The idea is to develop a feeling for the balance between font-size, line-height, and line length …just like the three sides of an equilateral triangle.
Too many of them still set line-height, font size and line width as independent features when in fact they should all be considered together. The equilateral triangle is a perfect representation of how the three features work in harmony.
Mapping Mountains · Mapzen
Everything you never wanted to know about conveying elevation information on maps, delivered in Peter’s always-entertaining style and illustrated with interactive examples.
Are Media Queries the answer to the Fold? « Boagworld
In a break with tradition, Paul posts something sensible and smart (I kid, I kid): using media queries to detect height rather than just width and adjust content accordingly to make sure that your most important content is visible in the viewport.
Line-height in input fields | 456 Berea Street
This abuse of the !important declaration in Firefox’s user-agent stylesheet was driving me crazy recently. Roger proposes a CSS patch, but this is really something that needs to be fixed in the browser.