Styling
CSS

CSS

I may have overlooked how complex CSS really was at the time. I typically brushed over the CSS, because I was in such a rush to learn React at the time.

Language Fundamentals

No need to worry about learning values and properties by heart. Lots of resources out there to look up such as mdn docs.

Basics: Flexbox vs Grid

Flexbox Reference - CSS Tricks (opens in a new tab)

Grid Reference - CSS Tricks (opens in a new tab)

How to utilize both

Grid is a newer than Flexbox and has less browser support, but it not a complete replacement to Flexbox, and should be used in junction with Flexbox.

  • Grid can make whole page layouts
  • Make literal grids
  • Require less media query intervention

Flexbox is for laying out items in a single dimension in a row OR column. Grid is for layout of items in two dimensions row AND column

Utilizing Both - CSS Tricks (opens in a new tab)