Pinned elements
Pinned elements will stay pinned to a defined position on the screen. You can use them to create Parallax effects with floating labels, centered content, sticky headers and footers, and much more.
To pin an element:
- With an element selected, look to the Properties palette and to the Position section.
- Click on the “Display pin position options” checkbox and dropdowns for the ‘X’ (width) and ‘Y’ (height) parameters will appear.
- Using the dropdown, select a position for the element. Add a margin in px from the pinned position if you’d like some spacing from the pinned position.
Pin position options:
The following are the options for pinning an element. The X and Y options can be combined. For example, an element can be pinned to the top and to the left.
X (width)
- Fixed (default): the element will not be pinned; it will not move with the screen
- Pin to left: the element will be pinned to the left of the screen
- Pin to center: the element will be pinned to the center of the screen
- Pin to right: the element will be pinned to the right of the screen
Y (height)
- Fixed (default): the element will not be pinned; it will not move with the screen
- Pin to top: the element will be pinned to the top of the screen
- Pin to center: the element will be pinned to the center of the screen
- Pin to bottom: the element will be pinned to the bottom of the screen