Assignment: Advanced CSS Selectors
I constructed a puzzle to familiarize you with some of the powerful selectors for targeting elements in CSS.
Download the zip below, and follow the instructions in the comments to fill in the style sheet. Do not alter the HTML file in any way. I should be able to check your stylesheet against my original HTML file.
I gave IDs to several of the elements in the HTML, labeling the major sections. Technically the entire assignment can be completed without using any classes or IDs (seriously). In real life however, this is unrealistic. We would add classes to make selecting things easier.
Some of the styles and techniques in this assignment are arbitrary and I wouldn't consider them best practice. The point is to give you a feel for what's possible. That said, a lot of what's in here will be useful to keep in mind for your own designs!
All of the problems in this assignment can be completed using a single selector unless otherwise noted.
Good luck!