The more I learn about CSS the more I realize there is to discover. From flexbox to grid to psuedo-classes, it is a deep subject and endlessly intriguing. Grid and flexbox can work together to easily create layouts that programmers of yester-year had to hack together with tools such as tables (see Space Jam). Flexbox allows us to adjust positioning on the x and y-axes while grid works in a two-dimensional model. What a time to be a developer.
Two particularly useful pseudo-classes are :hover and :nth-of-type(). Useful for menus and other interactive items, :hover can be used to change the styles when hovering over an element. This is a great feature so you can style links in a more visually appealing way than the standard styling but still let the user know that its a clickable element. When you are trying to style all but one of a certain element type, :nth-of-type() is your best friend. For example, say you had four paragraphs and you wanted extra margin under only the final paragraph you could grab that with p:nth-of-type(4). There are quite a few additional similar properties based and are tons of fun to play with. Note: these are 1 based rather than 0 based like many things in programming.
One topic that has caught my attention is the use of shortcuts to make coding more efficient. One such tool is emmet. Emmet is build in to my favorite text editor (VS Code) and makes everything so much quicker. Some of my favorite emmet shortcuts so-far are ! (+ tab) (automatically populate an HTML5 skeleton), .class-example (+ tab)(create a div with any specified class), .class-example.class-example-2 (+ tab) (create a div with multiple classes), #id-example (+ tab) (create a div with any specified id), link:css (+ tab) (automatically populate the code to link a style.css file. Another shortcut that I came across in my course work is using terminal to create folders, files, and even open them in VS code. Use mkdir to create a folder, touch index.html to create a file, and while in a directory simply type . code to open in VS code (once terminal and VS code are connected properly as described here). I get extremely excited whenever I find a new useful shortcut and I’m sure I will come across many more in the coming months.