Images with a large aspect ratio (width > height) are rendered with an excessive amount of vertical padding
Steps to reproduce
- Find or generate an image with a width (way) larger than its height. (The example image below was created using ImageMagick
convert -size 500x30 xc:white demo2.png) - Send that image in a room as a standalone message or as a reply (I tried EW and EXi, but any client should work)
- Observe the large amount of vertical padding.
This issue is not new, and I encountered this in the wild a few times. A public event that shows this behavior is in the public #synapse:matrix.org room at https://matrix.to/#/!ehXvUhWNASUkSLvAGP:matrix.org/$BV6jRBs8i1delUo-4KjMkXjHCFTfhvMZIWeebYNaoOo?via=matrix.org&via=matrix.breakpointingbad.com&via=dev.kyn.be
Outcome
What did you expect?
Less amount of padding.
This image is from my iPad, where this issue doesn't seem to happen and all images are about the same height:
What happened instead?
As you can see in the screenshot, the images around the reproducer are rendered with about half the height, so it is not (only) about the minimum height defined here (I hope I found the right piece of code).
Note: The reference image has the dimensions 500x100 and has the same width as the reproducer image. This leads me to believe this is some form of scaling/resizing issue when fitting the image to the available space, as on the wider screen above the reproducer is rendered in a wider bubble instead.
Your phone model
iPhone 13 mini / iPad Pro
Operating system version
iOS/iPadOS 17.4.1
Application version
1.5.12 (99)
Homeserver
Synapse 1.103.0 / Proxy 0.99.15
Will you send logs?
No
It just occurred to me to try this in landscape on my phone. This doesn't happen there, instead it is rendered in a wider box similar to the iPad.
While at it I also tried the modern layout where this happens as well. Here it even happens in landscape however way less pronounced, probably because there is more, but not enough horizontal space.