Image Captions

Note that the caption width should be contained to the width set by the image and not force the image to get wider if the text is longer.

Standard Caption

Overlay Caption

Offset Left

Stacks at the default (tiny) screen size.

Offset Right

Stacks at the medium screen size using .stack-medium.

Image Ratio Layouts with Captions

In previous Acora versions, images with captions in ratio layouts enforced using the caption overlay style, because otherwise sizing of the content would be unpredictable. From 10.6.1 onwards this is no longer necessary. However note that the image and caption will be dynamically sized within the ratio block based on the size of the caption unless the caption overlay style is used. Alternatively, it's possible to apply the ratio to the image tag directly (not the figure container tag), but note this is experimental and could be problematic in some mobile browsers. So there are various ways to handle image sizing...

Also note that in 10.6.1 the image will fit within the block shape (see the rounded styles below) whereas in earlier versions, the shape needed to be applied to the image aswell. It may be necessary to update existing content to avoid strange effects.

Square figure, standard caption, rounded

Square figure, caption-overlay, rounded

Square image, rounded figure