Every time I come back to doing CSS I have normally forgotten exactly what combination of class or id or tag is required to get the presentation I want. I have lost count of the number of times I have re-learned this CSS basics. So, belatedly, here is my cheat sheet which I plan to add to over time:

• A class is preceded by a .
• A ID is preceded by a #
• p.jam means paragraph with the class jam
• td#identified means td elements with an ID of identified

Selectors

Descendent selectors <class> <tag>

.navitem a {
            color: white;
            display: inline-block;
            text-decoration: none;
        }
        

This means <a> tags within anything of class navitem.

ID selectors tag.id

ul.navmenuright {
            width: 300px;
            list-style-type: none;
            float: right;
        }
        

Class selectors tag.class

ul#nav {
            width: 600px;
        }
        

Margins and Padding

margin: <top> <right> <bottom> <left>