The most commonly used layout properties in CSS are Float (detailed explanation of CSS floating property Float) and the other is the CSS positioning property Position.
1.position:static
The default positioning of all elements is: position:static, which means that the element is not positioned and appears where it should be in the document.
Generally speaking, you don't need to specify position:static unless you want to override the previously set positioning.
#div-1 {
position:static;
}
2. position:relative
If you set position:relative, you can use top, bottom, left and right to move the element relative to where it should appear in the document. [This means that the element actually still occupies its original position in the document, but is visually moved relative to its original position in the document]
#div-1 {
position:relative;
top:20px;
left:-40px;
}
3. position:absolute
When position:absolute is specified, the element is out of the document (that is, it no longer occupies a position in the document) and can be positioned accurately according to the set top, bottom, left and right.
#div-1a {
position:absolute;
top:0;
right:0;
width:200px;
}