A small activity to practice drawing HTML elements, and basic CSS, with additional difficulty of multiple screen sizes.

Go fullscreen: ⌃⌥F

Paper plans

Set up

  1. Form into pairs
  2. Get out pencils
  3. Download & print these files
  1. Draw boxes Determine what things will become HTML elements.

  2. Write semantics Assign each box a semantically appropriate HTML tag.

  3. Apply basic CSS @media, display, margin, padding, width, float, position

Start

A small activity to practice drawing HTML elements, and basic CSS, with additional difficulty of multiple screen sizes.