• in position, and therefore moved when the browser is resized.
• in size, and therefore be enlarged in width or in height when the browser is resized.

1. Select the requested element (control, layout area, cell, ...).
2. Define the element anchoring:
   • in the "UI" tab of the element description window.
   • via the "Anchor" option in the context menu of the desired element.

• On the "Page" tab, in the "Description" group, click "Description".
• On the "General" tab, select "Edit in "zoning", positioning by blocks and anchoring on controls".
• Validate.

• Go to the "Style" tab of the control description.
• Select the "Overflow" element.
• Select "Visible" for the vertical overflow and the horizontal overflow.
• Validate.

3. The window for defining the anchors is displayed:

• the anchoring in position, which determines how the control moves according to the size changes of the browser or container.
• the horizontal and vertical anchoring, which determines how the control is enlarged according to the size changes of the browser or container . In this case, you must specify whether the enlargement of the control is performed in relation to the browser (or container) or in relation to the content.

	No anchors	The control is not modified when the size of the browser or the size of the container element (cell, looper, ...) is modified.
	Horizontally centered	The control remains centered in width in the browser (or in the container element) regardless of the browser width.
	Right	The control moves to the right when the browser or the container element (cell, looper, ...) is enlarged.
	Vertically centered	The control remains vertically centered in the browser (or in the container element) regardless of the browser height (or regardless of the height of the container element).
	Centered	The field remains centered in height and width in the browser (or container element), whatever the size of the browser (or container element).
	Vertically centered to right	The control remains vertically centered in the browser (or in the container element) regardless of the browser height (or regardless of the height of the container element). However, the control is anchored to the right and it moves to the right when the browser or the container element (cell, looper, ...) is enlarged.
	Bottom	The control moves to the bottom when the browser (or the container element) is enlarged toward the bottom.
	Horizontally centered at bottom	The control remains horizontally centered in the browser regardless of the browser width. However, the control is anchored at the bottom and it moves to the bottom when the browser is enlarged.
	Right and Bottom	The field moves to the right and downwards as the size of the browser (or of the container element: cell, RepeatString, etc.) enlarges.

• Width anchoring: defines the width behavior of the field when the reference field is resized.. The overlaid control can:
  • keep the same width,
  • adapt to the content,
  • change along with the browser.
    
• Height anchor: defines the height behavior of the field when the reference field is resized.. The overlaid control can:
  • keep the same height,
  • adapt to the content,
  • change along with the browser.
    

• enlarge the control and push the other controls in the page,
• truncate the content,
• always enable a scrollbar,
• display a scrollbar only when the content is larger than the control.

Anchor display: red or blue arrows

• The red arrows represent the anchors implemented by the developer.
• The blue arrows represent the anchors deduced by WEBDEV to comply with the HTML constraints.

Example:

In this example, the anchoring was implemented on the Looper control (red arrows). The Button control next to the Looper control was automatically anchored by WEBDEV (blue arrows).

Special case of RepeatString fields: Anchoring in relation to content and maximum number of lines per page.

• If the number of rows is greater than the number specified, a ruler can be displayed, for example, under the Pager control field..
• If the number of rows is less than the specified number: by default, the space for the maximum number of rows is reserved.. If there are controls below the Looper control, an empty space will appear.

Special case: Anchoring to content

• the loading of pages will be slower.
• unexpected effects may appear.

Special case: Anchoring container fields

• Static Text control not anchored:
  
• Static Text control anchored in width:
  
  
• Static Text control field anchored in width and adapted to content: whatever the browser size and if no other HTML constraints exist, the label is adapted to the content.