Variants: Horizontal position of the text
The area of the image that contains the motif can be defined and therefore not be covered by text.
Depending on the size of the screen, the image is cropped differently and the object is positioned so that it is always visible.
If the image contains a protected area, the heading will be displayed below the Hero image on mobile devices.
Responsive behaviour
On mobile devices, the text is displayed below the image if the protected object would be covered. This also preserves the impact of the image.
Right 1/2 protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
Right 1/3 protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
Left 1/3 protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
Left 1/2 protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
Alignment Centered, 1/3 left+right protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
Alignment Centered, 1/5 left+right protected
Lorem ipsum
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat,
This is a Page with dummy text.
Content with the wording "Lorem Ipsum" is only a placeholder.