Fixed Positioning

The last type of positioning availble in CSS is fixed. This positions the element in relation to the browser window so that when a user scrolls, the element stays in place.

.fixed-box {
    position: fixed;
    left: 200px;
    z-index: -1;
}

The orange div is now in a fixed position. It will stay in place when you scroll up and down.



Real World Examples