Image Block Constraints

Introduction

page title heading deeplink

Image blocks present their pictures with two different containment constraints: width and height.

When constrained by width (the default), the images have a width of 100% and a height of auto . This means that the image should have it's full width visible, limited to the actual width of the enjin block content.

When constrained by height, the images have a width of auto and a height of 100% . This means that the image should have it's full height visible and because it's not constrained by the height of this page content (blocks can be as tall as their content needs), the image is actually it's full height on the page.

For contrast demonstration purposes, the below constraint examples are both configured to have a data-image-size of actual so that there's no other limitations impacting the different constraint options.

top

Width

page title heading deeplink
an example image

Set nothing (as this is the default constraint), or set either: the data-image-constraint attribute to width , or include the word width in the shorthand data-image space separated attribute.

top

Height

page title heading deeplink
an example image

Set either: the data-image-constraint attribute to height , or include the word height in the shorthand data-image space separated attribute.

top