CSS Fixed Positioning

By  on  

When you want to keep an element in the same spot in the viewport no matter where on the page the user is, CSS's fixed-positioning functionality is what you need.

The CSS

	.element	{ position:fixed; top:2%; right:2%; }

Above we set our element 2% from both the top and right hand side of the viewport. You can scroll on the page forever but our element will still stick to the specified 2% mark. You can see fixed positioning in effect on the Facebook website (chat toolbar).