Image sizes

Images can take different sizes depending on the dimensions of the container and the native dimensions of the image.

You can find more details on the differents behaviour on this page: https://developer.mozilla.org/fr/docs/Web/CSS/object-fit Keep in mind that Chocolat doesn't use object-fit, but it reproduces its behaviour with javascript.

scale-down

If the image is bigger than the container it's resized to fit. If the image is smaller than the container it's not streched, only displayed at native dimensions.

contain

If the image is bigger than the window it's resized to fit. If the image is smaller than the window it's streched, to fit the container.

cover

The image cover the container, no white space are displayed.

native

The image is never streched nor shrinked, always displayed at native dimensions.