Normal
Absolute (px) element size.
Safezone
Page
How should your elements behave on the scene? Should it stick itself to its fixed position on the page, or should it align to the screen borders? This course covers all there is to know about element positioning.
Element positioning
BASIC TUTORIAL
Optimise the use of space
Depending on the screen size, larger screens can display a page with a lot of space outside the safe zone.
To prevent empty space, you can use variable element positioning to fill a page.
Element alignment
There are three different ways to align your elements to make them respond to either the fixed page settings or the variable screen sizes. Each alignment option will give the element a certain position on different screens.
In order to create a fullscreen effect, elements can be aligned to the screen border. This setting will ignore page & safe zone settings and the element will receive a variable position according to the screen.
Screen border
Sticky elements also ignore page & safe zone settings and will stick themselves to their position on the page. When scrolling through the page, the element will keep it’s position on the screen.
Sticky
More info about page types & safe zone
New elements will always be ‘freely positioned’ on the canvas. This means that they have an absolute position on the page itself. If (a part of) the element is placed outside the safe zone, it will be cut off on smaller screens.
Free position
Auto size
Automatically resize your elements to always display across 100% of the width and/or height of the screen.
Click on the options for more information.
Click the button to show ‘safezone example’
Free position
New elements will always be ‘freely positioned’ on the canvas. This means that they have an absolute position on the page itself. If (a part of) the element is placed outside the safe zone, it will be cut off on smaller screens.
Screen border
In order to create a fullscreen effect, elements can be aligned to the screen border. This setting will ignore page & safe zone settings and the element will receive a variable position according to the screen.
Sticky
Sticky elements also ignore page & safe zone settings and will stick themselves to their position. When scrolling through the page, the element will keep it’s position on the screen. Sticky elements are only available on longpage scenes.
Element placement
Determine how elements should behave in the element panel. Base its position on the page, the screen border, or make it sticky.
Auto size
In the element panel, elements can be resized to 100% of the width and/or height of the screen, creating a fullscreen effect.
‘crane washer’
is aligned to the right screen border
‘hanging washer’ is aligned sticky
‘standing washer’ is positioned freely
‘curb’
is full width
‘lantern pole’
is full height
‘background wall’ is positioned full screen
Scroll down to view more of this longpage
‘bush’
is aligned to the left screen border
Go to the next basic course
How should your elements behave on the scene? Should it stick itself to its fixed position on the page, or should it align to the screen borders? This course covers all there is to know about element positioning.
Element positioning
BASIC TUTORIAL