Selecting Elements by Context
In CSS, you can pinpoint elements depending on their ancestors, their parent, or their siblings (see “Parents and Children” in Chapter 1) ( through ).
An ancestor is any element that contains the desired element (the descendant), regardless of the number of generations that separate them.
I’ve shortened the text to make the relationships between elements easier to see. Each indentation represents a generation. Note that ...