How to define a max width + height?

[Sebobo]

Given I have an image with the dimensions 2000 x 700

Now my (reduced) implementation is as follows:

<Sitegeist.Kaleidoscope:Picture imageSource={props.image} width="1920" height="1280">
     <Sitegeist.Kaleidoscope:Source srcset="960w, 1280w, 1920w" />
</Sitegeist.Kaleidoscope:Picture>

Now the output of the sources is limited to 1050 x 700.
But I expected 1920 x 672.

That was a bit unexpected for me and took a while to debug until I considered the aspect ratio.
But I cannot influence this via the props from what I see and in the PHP part it looks to me as the aspect ratio is not kept by default.

So I removed the height attribute and everything worked fine. I assume it shouldn't be a problem in the project but I would still prefer to be able to limit the maximum height.

Is this considered the correct behaviour?

[rolandschuetz]

Hmmm... with and height are misleading here, and should probably be called differently.

[manuelmeister]

I tried to fix this in #77. Can you test if this would have solved your use case?

I think if you set both width and height, it is somewhat expected, that the image returned has the same aspect ratio. If only one is given, then it will respect the source aspect ratio. The width and height attributes are set on the images inside by default. So in most cases, they can be omitted.

[Sebobo]

Thx, have to find where I had the problem and verify it 🙂