Image rendering fixes

[viinikv]

1:
Adding width and height attributes to an image changes it's size. They are recommended to prevent layout shifts: MDN: preventing jank when loading images. However now the image gets rendered using height from this attribute, and width: 100%. This results in a larger image that is also cropped from the sides. Adding height: auto fixes this. I don't know if this is important enough for classless-tiny.css but added it anyway.

Could we now remove object-fit: cover? As far as I understood, it only does anything when width and height specify a different aspect ratio than the image natively has, and height: auto uses the native ratio. I guess it could still be useful if somebody sets min-height or max-height elsewhere (or overrides height).

2:
Images inside cards have a gap at the top with fonts other than Open Sans. Inline rendering means that the 3px gap is font-dependent. Fixed by display: block and removing the negative margin.

Also, the documentation says:

Any <img> directly within the card will span the full width.

but that's not true if the image is narrower than the card. Maybe there should be a width: calc(100% + 1.2rem) to set this?