CSS in Depth

Chapter 7. Positioning and stacking contexts

This chapter covers

• The types of element positioning: fixed, relative, and absolute
• Building modal dialogs and dropdown menus
• CSS triangles
• Understanding z-index and stacking contexts
• A new type of positioning: sticky

We’ve now looked at multiple ways to control the layout of the page, from table display to flexbox to floats. In this chapter, we’ll look at one important technique: the position property, which you can use to build dropdown menus, modal dialogs, and other essential effects for modern web applications.

Positioning can get complicated. It’s a subject where many developers only have a cursory understanding. Without a complete grasp on positioning, and the ramifications involved, it’s ...