Fixing

Using the fixed-top and fixed-bottom helper classes, elements can be fixed to the top or bottom of the page respectively. This is achieved by setting the position property to fixed, clearing the element's left, right, and top (or bottom in the case of fixed-bottom), and increasing the z-index to ensure that the element appears in front of all the other elements on the page. Looking at the Bootstrap style sheet, we see that fixed-top and fixed-bottom are defined as follows:

.fixed-top {
     position: fixed;
     top: 0;
     right: 0;
     left: 0;
     z-index: 1030;
}

.fixed-bottom {
     position: fixed;
     right: 0;
     bottom: 0;
     left: 0;
     z-index: 1030;
}

The sticky-top class is similar to fixed-top, with the exception that the element only gets positioned to the top of the page after the user scrolls past the element. The helper class achieves this by doing the following:

1. Setting the position property to sticky.
2. Setting the top of the element to 0.
3. Setting the z-index...