Skip to content

Files

Latest commit

 

History

History
45 lines (38 loc) · 1.07 KB

README.md

File metadata and controls

45 lines (38 loc) · 1.07 KB

Module 2 - The Box Model

Box Model

[]

  • Content Width and Height
  • Padding
  • Border
  • Margin

Sizing Units

  • px
  • %
  • em and ex
  • vw, vh, vmin and vmax
  • cm and mm

Displays

  • Display Block
  • Display Inline
  • Display Inline-Block

Fun with Borders

  • Border parts and sizing
  • Border Styles
  • Rounded Corners

Margin Collapsing

  • Vertical Block elements collapse
  • Horizontal elements do not collapse
  • Only adjacent elements collapse
  • Nested elements collapsing
  • Collapsing more than two elements
  • Margin with Flex or Grid
  • Using the gap property

Box Sizing

  • The problem with CSS 2 Box sizing
  • The box-sizing property
  • border-box vs content-box

Extra links