Header

The 3-column layout is a classic because it's a simple and effective way to cram a lot of links into one layout. Translating all those links to a smaller screen is a bit of an ordeal, and I find that the usual method of appending the sidebars to the top and bottom of the content is clunky and takes up way too much space. I tried to fix this by having the columns collapse into columns on mobile instead. I moved both menus below the content area so you don't have to scroll past links every time you load a new page, but you can change that by messing with the flexbox order.

You can copy the source code for this from Github! Or just take it from the view source page directly.

Header 2

Header 3

Here is a link. Here is what a form looks like:

Selection Option 1 Option 2 Option 3

Textarea

Button

• This
• is
• a
• list
  • List
  • inside
  • of
  • list