Dynamic Widgets

  1. One widget displays a single full-width row.  
  2. Two widgets will display as two (2) full-width rows.
  3. Three widgets will display as two (2) rows. The first row will display full width. The second row will display as two (2) columns equal to approximately one-half the width of the widget area.
  4. Four widgets will display as two (2) rows. The first row will display full width. The second row will display as three (3) columns equal to approximately one-third the width of the widget area.
  5. Five widgets will display as two (2) rows. The first row will display full-width. The second row will display as four (4) columns equal to approximately one-quarter the width of the widget area.
  6. Six widgets will display as four rows. The first and last row will display as full-width. The middle two (2) rows will display as two (2) columns equal to approximately one-half the width of the widget area.
  7. Seven widgets will display as three rows. The first row will display full-width. The second and third rows will display as three (3) columns equal to approximately one-third the width of the widget area.
  8. Eight widgets will display as five (5) rows. The first and last row will display as full-width. The middle three (3) rows will display as two (2) columns equal to approximately one-half the width of the widget area.
  9. Nine widgets will display as three rows. The first row will display full-width. The second and third rows will display as four (4) columns equal to approximately one-quarter the width of the widget area.

image courtesy of StudioPress