Voordat we wat typografisch werk gaan doen, dacht ik dat we het vervelende probleem zouden oplossen waarbij de afbeeldingen buiten het artikelgebied en het raster breken. Met behulp van enkele eenvoudige CSS-regels om inline afbeeldingskenmerken en -stijlen te negeren, kunnen we afbeeldingen samenpersen zodat ze op de juiste grootte in ons bericht passen.
Het squishen van afbeeldingen zoals deze was vroeger nogal oncool omdat browsers het formaat niet goed deden, maar dit is niet meer het geval. Het is eigenlijk een goed idee, aangezien beeldschermen een hogere resolutie krijgen, omdat de beelden scherper zullen zijn.
Het wijzigen van de grootte wordt in wezen afgehandeld door:
figure img ( max-width: 100%; height: auto !important; )We stylen de figuren en afbeeldingbijschriften een klein beetje op om ze er, weet u, uit te laten zien als een goed figuur in een blogpost.