Positions in CSS
2 min read
What are CSS Positions?
CSS Positions property is used to position an element in a particular place in a document. To align the elements, this property works with top, left, bottom, right, and z-index properties.
There are 5 values in position property they are:
This is the default value of any element. The element is positioned according to the regular flow of the document.
In this top, left, bottom, right, and z-index properties do not affect the elements.
This relative position remains in the regular flow of the document. Same as
position: static But unlike static position, the top, left, bottom, right, and z-index properties affect the elements to offset.
This absolute position is positioned relative to the parent or the root element. The element is removed from the regular flow.
In absolute position, the elements will behave as if that element is not in that document.
In this top, left, bottom, and right determine the position of the element.
This fixed position is used for positioning in a fixed position anywhere in a document.
Here also the element is removed from the regular flow of the document. But always positioned relative to the root element.
This sticky position is simply a combination of relative and fixed.
It will look like a relatively positioned element until we scroll about the element.
Did you find this article valuable?
Support Prahlad Inala by becoming a sponsor. Any amount is appreciated!