Aligning and Positioning
The Kendo UI for Vue Native Popup enables you to align it to components and absolute points as well as to control its position.
Aligning to Components
To align the Popup to a specific component, use the anchor
property. The Popup opens next to the defined anchor component.
If an
anchor
is not provided, the Popup will use theoffset
property value.
Aligning to Absolute Points
To align the Popup to a specific absolute point that is relative to the document, use the offset
property. The Popup opens next to the point and uses the specified popupAlign
configuration.
Positioning
Both the anchor and the Popup are treated as rectangular elements and, as a result, each has nine pivot points. You can align every point of the Popup to an anchor point. The component will position itself by aligning its top-right point to the bottom-right point of the anchor. If we want to use the popup-align
prop we need to add concrete width and height to the inner container of the popup.