x

Open in Github Open in StackBlitz
@twicpics-components
Documentation

anchor property

The anchor property positions the image in both contain and cover mode.

It allows to:
  • position the letterboxed image in its container in contain mode.
  • determine what should be visible when the image is cropped in cover mode.

Accepted values are top, bottom, left, right, top-left, top-right, bottom-left, bottom-right and center.

Please note that anchor is applied after an eventual transformation defined with preTransform property.

For a more specific positionning see position or focus properties in for contain or cover mode respectively.

anchor="center" mode="contain"
anchor="center" mode="contain"
anchor="center" mode="cover"
anchor="center" mode="cover"