roster

2. The Stacking Order The word "purpose" is actually there, but it is on the second line. You can't see it because of the DOM order: In your HTML, .sticky-header comes before the .card-container. In CSS, elements that appear later in the code are naturally "higher" in the stack. The .card-container is sitting right in the middle of the screen. When your text wraps to a second line, that line is being hidden behind the cards. 3. The line-height: 1 Factor Because the line-height is set to exactly 1, there is no extra spacing between lines. This makes the text "hug" the cards even more tightly, leaving no room for the wrapped word to peek out from behind them. Summary of the "Connection": The browser thinks it only has half a screen for the text $\rightarrow$ it wraps "purpose" to line 2 $\rightarrow$ line 2 is physically covered by the cards because the cards are written after the header in your HTML.