In Droip, you have the flexibility to adjust the placement of elements using Position. This property is accessible in the Style Panel on the right-hand side.
Click on the dropdown at the top of this section to select the Position Type. Below is the list of the 5 different values the Position property has to offer:
Elements are positioned based on the usual flow of the document. Other values have no effect. This is set as the default value for Position.
Elements flow normally but can be offset using top, right, bottom, and left values. This means that other elements will behave as if it is taking their usual position even when its offset.
Elements are removed from the usual flow of the document and positioned relative to their closest ancestor if any or placed relative to the initial containing block.
The final Position is based on the top, right, bottom, and left values.
Fixed positioning removes an element from the normal document flow and positions it relative to the viewport, which means it remains fixed in its position even when the page is scrolled. This is true regardless of the ancestor elements' properties like transform, perspective, filter, or will-change.
The element's final position is determined solely by the values specified for top, right, bottom, and left, without considering the properties of their ancestor elements.
Elements are positioned based on the usual flow of the document and then offset relative to the nearest scrolling ancestor and containing block based on top, right, bottom, and left values. Other elements’ Position is not affected by this offset.
You can adjust an element's position using the following offset values:
Click on the Float & Clear button to open its settings. From here you can set the value for Float and Clear.
Choose how elements should align within their container:
Set whether an element should be moved below floating elements that precede it. In other words, this defines what will happen to an element that’s next to a floating element. Also, this property applies to both floating and non-floating elements.
For this property, you can set any one of the following three:
Was this page helpful?
Our website uses cookies to improve your browsing experience on our website. By continuing to use this website, you agree to their use. For details, please check our Privacy Policy.
Experience Droip in Action – Explore a live-built page and see the power of our builder in action.
Explore Live