CSS Tutorial

Coming Tutorials

>Home>CSS Tutorial>Position Property

CSS Tutorial

Coming Tutorials



CSS Position Property

The position property is used to change the position of an element on the web page.


The position property has below values ::

• static - this is default value, it will position the element according to their position in the HTML source code. top, bottom, left and right properties will not work with static position.

• relative - its position is relative to the default position, top, left, bottom, right will start counting from default position.

• absolute - its position is relative to its non static parent means left, right, bottom, left will start counting from position of its relative parent.

• fixed - it is used to fix the position of an element at particular location

• sticky- it works like relative and fixed positions, initially element will appear on its default position , if we scroll down then the element will not hide outside the viewport instead en element will appear at a fixed location.


If we want display an element always to top right corner on the web page.

selector{
position: fixed;
top: 0;
right: 0;
color: red;
}

Share the article to help your friends