Trial Two

Flexbox demonstration

The left column is an example of justifying the content.

  • It utilizes the following Flexbox commands:
  • justify-content > space-between
  • align-items > align-center

The right column is an example of content justification and direction.

  • It utilizes the following Flexbox commands:
  • justify-content > flex-end
  • flex-direction > row-reverse
  • align-items > stretch
    • full box stretch height applied to item 4
    • set height of 150px declared to item 5
    • set height of 100px to item 6

flex item 1
flex item 2
flex item 3
flex item 4
flex item 5
flex item 6