Almost none of the images honour the dimension setting

[kartagis]

Hello,
Even though I've explicitly specified dimension to be 150, all of the images

• Are 100px in the DOM
• Even with that, their dimensions are wrong.

Please see the below screenshot from chrome://inspect.

[domax]

1. Your HTML <img> element contains width attribute that is set to "100", so that browser tries to render it with this width, ignoring height attribute. Informing the Browser — the actual purpose of width attribute, and see also The Proper Use of height. If you want to render your image neglecting its recommended dimensions (img's width and height attributes), you should use CSS width and height properties.
2. As far I can get from your screenshot, top row of your photo grid are panoramas - such a photos have very long width and short height. At the left side of screenshot you have a balloon where you can see an original (natural) dimensions of your panorama thumbnail: 150 x 28 pixels.

I cannot see any issues depending on this plugin.

[domax]

Just in case: thumbnail() function does not make any padding/color-filling in thumbnails - it just resizes an original image to desired dimension you specify in options. Aspect ratio is preserved. To compute a thumbnail size, it uses the following algorithm:

cf = dimension / max(image.width, image.height)
thumbnail.width = image.width * cf
thumbnail.height = image.height * cf

[kartagis]

Is dimension here the dimension in Photos.thumbnail() ?

…

On 7 February 2017 at 12:24, domax ***@***.***> wrote: Just in case: thumbnail() function does not make any padding/color-filling in thumbnails - it just resizes an original image to desired dimension you specify in options. Aspect ratio is preserved. To compute a thumbnail size, it uses the following algorithm: cf = dimension / max(image.width, image.height) thumbnail.width = image.width * cf thumbnail.height = image.height * cf — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#10 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABiHXtx7WC6OYsSRV_mkDMQmHlJK3ZGfks5raDg8gaJpZM4L5KnD> .

-- ~~~~

[domax]

Exactly