Sizing & Positioning
Last updated
Last updated
Allows you to set the positioning and size of the image background type.
The Background Position property defines the position of the background image.
You can select an image position by using the donut or left/top.
Select a block.
Open the Block Inspector.
Navigate to the Design Tab.
Open the Background Tab.
Open the Source Tab.
Find Image.
Click to select.
Find the Image URL property.
Select Image by Clicking 🔍 (Browse) or copy/paste a URL.
Select the image position by using the donut or left/top.
Click dot to reset position.
The Background Size property defines the size of the background image and gives you options such as cover, contain, manual.
Cover Fully covers the width and height of the background area without distortion. The background image may be cropped if it is larger.
Contain Adapts to the size of the background area without distortion. There may be blank spaces if a Repeat property is specified.
Manual Adapts to the dimensions specified by the user.
The Background Size property only appears when an image has been selected for the Background Source.
Select Image.
Open the Block Inspector.
Navigate to the Design Tab.
Open the Background Tab.
Open the Sizing And Positioning Tab.
Click on the appropriate size options (Cover, Contain, Manual).
The Background Repeat property allows you to manage the horizontal and vertical repetition of the background image. The repetition of the background image is done relative to its initial position.
The Background Repeat property only appears when an image has been selected for the Background Source.
X The background image does not repeat.
Repeat Default value. The background image repeats horizontally and vertically.
Repeat-Y Only the background image repeats vertically.
Repeat-X The background image only repeats horizontally.
Select an Image.
Open the Block Inspector.
Navigate to the Design Tab.
Open the Background Tab.
Open the Sizing And Positioning Tab.
Find the Repeat property.
Select the appropriate size icon (No-repeat, Repeat, Repeat-y, Repeat-x).
Select an Image.
Open the Block Inspector.
Navigate to the Design Tab.
Open the Background Tab.
Open the Sizing And Positioning Tab
Find the Repeat property.
Click "X" icon to remove.
The Background Parallax property defines how the background image will behave when scrolling the page.
The Background Parallax property only appears when an image has been selected for the Background Source.
Unset The background image moves when scrolling.
Fixed The background image will not scroll with the page, and will remain positioned according to the viewport.
Select an Image.
Open the Block Inspector.
Navigate to the Design Tab.
Open the Background Tab.
Open the Sizing And Positioning Tab.
Find the Parallax property.
Select the appropriate size options (Unset, Fixed).
