Fix extra space under img

[sunyiming]

No description provided.

[amphineko]

Hello, thanks for your contribution.

Could you provide me a live example that reflects your changes?

[sunyiming]

Take this page for an example. On Chrome 92, the size of <picture> element is 329.6 x 333.6 px, but the size of its child element <img> is 329.6 x 329.6 px, which leave space under the <img> element. It will be more obviously if you change the avatar to a black image.

I think adding vertical-align attribute to <img> element may fix this bug.

[amphineko]

What do you think if it's better to fix using flex.

[sunyiming]

It also works.

I found stackoverflow discussion about it: https://stackoverflow.com/questions/5804256/image-inside-div-has-extra-space-below-the-image

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployments, click below or on the icon next to each commit.

atomicneko-next – ./

🔍 Inspect: https://vercel.com/amphineko/atomicneko-next/66oNW7hBr3JZ3CLB65CkQ4roQ6aX
✅ Preview: Failed

atomicneko – ./

🔍 Inspect: https://vercel.com/amphineko/atomicneko/2xRMrMfcJqgLMZxAqgFncQriqrYm
✅ Preview: Failed