Styling Images and SVG Icons: the img Reset, object-position, image-rendering, fill, stroke and currentColor
The gap under an image comes from img being inline; a reset of display: block, max-inline-size: 100% and block-size: auto removes it, keeps the ratio and still lets the width/height attributes reserve space. The post measures object-position for the focal point, image-rendering and image-orientation, fill, stroke and currentColor in inline SVG, Bookstore's icon set from a single sprite, and logo colors with light-dark() in dark mode.
15 Nov 2026
·
13 min
·
19
