The Pro mode helps to add elements in any part of the screen, regardless of their size,&nbsp;which will&nbsp; fit in every screen. &nbsp;<h2 class="PlaygroundEditorTheme__h2" dir="ltr" style="text-align: start;">Switching to PRO</h2>Dynamic elements alignment feature is a quite complicated action, that's why we introduced the&nbsp;PRO functionality. Webmasters, who are not satisfied with basic position and sizes functions, can turn&nbsp;on PRO in the <a href="https://help.sitedu.de/articles/settings-panel-f0a2d0-bbd6c" rel="noreferrer" class="PlaygroundEditorTheme__link">Settings Panel</a>. In order to&nbsp;switch to PRO mode, select an element and in the Settings Panel in "Position and size" click on PRO. <img src="https://help.webwave.me/lib/dkwr2z/Screenshot_70-l9pqp9rm.png" alt="" width="inherit" height="inherit"> <h2 class="PlaygroundEditorTheme__h2" dir="ltr" style="text-align: start;">Dynamic position</h2>The Dynamic position option gives you ability to position your elements depeding on the corners of the screen. In this way, you can attach any elements to the left or right screen frame. You have to only set the Layout to the left/right side of the screen. &nbsp;<img src="https://help.webwave.me/lib/dkwr2z/Screenshot_69-l9pqnkps.png" alt="" width="inherit" height="inherit">&nbsp;<h2 class="PlaygroundEditorTheme__h2" dir="ltr" style="text-align: start;">Alignment and size</h2>Position and dimension allow you to set the alignment and size of the element on your website. These functions can be set in different units: px,&nbsp;VH, and VW.&nbsp; <img src="https://help.webwave.me/lib/dkwr2z/Screenshot_72-l9pskw3h.png" alt="" width="inherit" height="inherit"> <h2 class="PlaygroundEditorTheme__h2" dir="ltr" style="text-align: start;">Available Units</h2> <h3 class="PlaygroundEditorTheme__h3" dir="ltr" style="text-align: start;">PX</h3>It's a default unit in the website builder used for setting a static size and alignment of elements. Elements set in px will always have the same size and alignment, irrespective of the screen size &nbsp;they are being viewed at.&nbsp; <img src="https://help.webwave.me/lib/dkwr2z/px-jyh3nxce.png" alt="" width="inherit" height="inherit"><h4 class="PlaygroundEditorTheme__h4" style="text-align: start;">&nbsp;</h4><h3 class="PlaygroundEditorTheme__h3" dir="ltr" style="text-align: start;">VW</h3>The next unit is calculated in regard to the screen width. If you want the element to occupy the whole&nbsp;screen width, set it to 100 vw. When you set it to 50 vw, then the element will occupy a half of the screen width.&nbsp;&nbsp; <img src="https://help.webwave.me/lib/dkwr2z/vw-jyh3pgjg.png" alt="" width="inherit" height="inherit"> <h4 class="PlaygroundEditorTheme__h4" dir="ltr">VH</h4>This unit is calculated in regard to the screen height. If you want the element to occupy the whole&nbsp;screen height, set it to 100 vh. If you set it to 50 vh, then the element will occupy a half of the screen height.&nbsp; <img src="https://help.webwave.me/lib/dkwr2z/vh-jyh3pu38.png" alt="" width="inherit" height="inherit">

Learn about the Pro Mode in the SiteDu.de builder

The Pro mode helps to add elements in any part of the screen, regardless of their size, which will fit in every screen.

## Switching to PRO

Dynamic elements alignment feature is a quite complicated action, that's why we introduced the PRO functionality. Webmasters, who are not satisfied with basic position and sizes functions, can turn on PRO in the[Settings Panel](https://help.sitedu.de/articles/settings-panel-f0a2d0-bbd6c).

In order to switch to PRO mode, select an element and in the Settings Panel in "Position and size" click on PRO.

![](https://help.webwave.me/lib/dkwr2z/Screenshot_70-l9pqp9rm.png)

## Dynamic position

The Dynamic position option gives you ability to position your elements depeding on the corners of the screen. In this way, you can attach any elements to the left or right screen frame. You have to only set the Layout to the left/right side of the screen.

![](https://help.webwave.me/lib/dkwr2z/Screenshot_69-l9pqnkps.png)

## Alignment and size

Position and dimension allow you to set the alignment and size of the element on your website. These functions can be set in different units: px, VH, and VW.

![](https://help.webwave.me/lib/dkwr2z/Screenshot_72-l9pskw3h.png)

## Available Units

### PX

It's a default unit in the website builder used for setting a static size and alignment of elements. Elements set in px will always have the same size and alignment, irrespective of the screen size they are being viewed at.

![](https://help.webwave.me/lib/dkwr2z/px-jyh3nxce.png)

### VW

The next unit is calculated in regard to the screen width. If you want the element to occupy the whole screen width, set it to 100 vw. When you set it to 50 vw, then the element will occupy a half of the screen width.

![](https://help.webwave.me/lib/dkwr2z/vw-jyh3pgjg.png)

#### VH

This unit is calculated in regard to the screen height. If you want the element to occupy the whole screen height, set it to 100 vh. If you set it to 50 vh, then the element will occupy a half of the screen height.

![](https://help.webwave.me/lib/dkwr2z/vh-jyh3pu38.png)

Dynamic Elements in the Pro Mode

Got a builder package? Learn how to use it and how to edit your content

Was this article helpful?