Før vi gjør litt typografiarbeid, tenkte jeg at vi ville fikse den irriterende tingen der bildene spretter utenfor artikkelområdet og rutenettet. Ved å bruke noen enkle CSS-regler for å overstyre innebygde bildeattributter og stil, kan vi klemme bilder for å passe inn i innlegget vårt i riktig størrelse.
Squishing av bilder som dette pleide å være ganske lite kjølig da nettlesere gjorde en dårlig jobb med å endre størrelse, men dette er ikke tilfelle lenger. Det er faktisk en god ide ettersom skjermer får høyere oppløsning, ettersom bildene blir skarpere.
Endring av størrelse håndteres i hovedsak av:
figure img ( max-width: 100%; height: auto !important; )Vi styler figurene og figcaptions bare litt for å få dem til å se ut, vet du, som en skikkelig figur i et blogginnlegg.