Skip to content

Latest commit

 

History

History
44 lines (21 loc) · 1.35 KB

lesson-9-css-flexbox.md

File metadata and controls

44 lines (21 loc) · 1.35 KB

  • Introduce our open source project, HALOGEN

    • How we'll be working on it, why we'll learn this way

  • Building this will require styling knowledge we don't have, in particular flexbox. let's goooooo

What is flexbox?

  • Flexbox is a special display property in CSS.

  • What is a display property? Let's check it out!

  • Fork and clone repo

  • Show display properties

    • Use dev tools to show "computed"

  • Show flexbox for centering

  • push back up to your own repo

  • share halogen board, have them bookmark

  • start together on first super simple bootstrap of html document

  • show how I will push it back up to my branch, submit a pr, and merge (trunk based development)

    • do like a diagram of git dots and commits.
    • Show how git log works

  • start on stories with peeps

Let's take a look at a very simple example, and a very common use case. Go ahead and fork and clone this flexbox learning repository.

What problem does flexbox solve?

In CSS, it is notoriously difficult to center things. Because a lot of the old tactics used are no longer relevant in the modern web, we aren't going to be learning them. But just keep in mind that learning CSS flexbox layout solves a huge problem that gave many folks many headaches. So treasure it!