Site borders and elements

Grids and guides

For easy placement of elements on the page, use «Grids and guides».

You can adjust the working area in the most convenient way.

Borders, guides and moving elements

1. The borders of the working area are marked by grey dotted lines. You can change the location of horizontal borders by moving the cursor over them and clicking the left mouse button (hereinafter, the «LMB»).

2. By moving the cursor over an element you can see the distance in pixels from the edge of the element's borders to the borders of another element or the field edge. The borders of the elements can overlap.

3. You can select several elements by holding down the LMB and moving the cursor or select them individually while pressing Ctrl key.

4. You can move the selected elements not only with the mouse, but also with the arrow keys - by 1 pixel or by 10 while holding Shift.

5. By holding the LMB on or clicking within the element borders you can move it within the working area. The Website Builder will help you place an element parallel to the other or to align it centrally in relation to a page or another element (if the respective functions are active in «Settings» → «Grids and guides».

6. By holding the LMB on you can move up and down all the elements located lower than the upper edge of the element and thus increasing the length of the page.

Context menu and functions

When you right-click (hereinafter, the «RMB») over free space, an element, or several selected elements, a context menu will open.

This menu, apart from the unambiguous functions, has the following options:

«Lock» — appears when you click on an element or several elements. Restricts moving, resizing or changing the settings of an element in the working area.

«Order» — changes the order of overlapping elements.

«Alignment» — available when you press on several selected items. It allows aligning several elements that are at different positions horizontally and vertically.

«Spread» — available if you press on several selected items. It allows setting an equal distance between 3 or more items.

«Group» — available when you press on several selected items. Combines several items into a group. Adding elements to a group allows you to move or set rules to the elements more conveniently. Elements in a group are edited individually.

Всё ещё остались вопросы?