Flexible Content

Chapter 5

Flexible layouts are useless if your content can’t adapt. After all, our websites exist to show our content. So here we discuss having flexible text, images, tables and video.

Flexible text

  1. Default text size
  2. Long running text with no changes
  3. Compounding ems
  4. Flexible text with media queries
  5. Flexible text - leveraging body size
  6. Flexible text - using rem
  7. Flexible text - FitText

Flexible Images

  1. Image control with CSS
  2. High Resolution Background Images
  3. Image control with PictureFill

Flexible tables

  1. Table
  2. Scrolling Table
  3. Table Detablified
  4. Table Detablified #2
  5. Table Detablified #3
  6. Table Detablified #4
  7. Table with Zurb Responsive Tables
  8. Footable

Flexible Video

  1. Video
  2. Responsive Video
  3. Basic Video Embedding
  4. Responsive Embedding
  5. Scripted Embedded Video Resize