The web is a publishing platform. First things first, we should get our semantics right, just like we expect a book publisher to do.
Don't want to hit print, then save as PDF, then open the PDF viewer ... again and again and again?
When using the flex shorthand, you cannot use % for flex-basis if using calc.
How do I align a custom list-style/bullet point in a list with CSS? You use flexbox!
Here's a small piece of CSS - simple, but posting here for posterity - to add a different style to a hovered/focussed link's ::after pseudo element.