Height of Advance Carousel Block

Let’s assume,

• You have 10 items in carousel of size – 300 X 300px
• You are displaying 5 items in one view.
• The carousel block is placed in row which is 1170px wide container (this depends on your theme)

Now –

• Collective width of your carousel is approximately 1500px (5 images that are 300px wide)
• However, the carousel block is placed in a row which is 1170px wide row.

Obviously, all images can not be visible here in this case.

So, images will be scaled down in a responsive manner and your images will appear a bit smaller. When the width of an image is reduced – the height of an image is reduced too so that it will be proportionate.

More details –

• Assuming row container is 1170px wide
• Carousel block is supposed to display 5 images

Each image gets an area of 234px (approximately)
(1170px divided by 5 images)

And the individual images of 300 X 300px are resized to fit in the assigned 234px area.

Hope this clarifies.