This is the skeleton of the first layout I made for this website, which was itself built off the skeleton from this old thing. I ended up with more pages than would be reasonable to put on a sidebar, so I scrapped the 2-column layout for the single column thing you see now. But it still works, so I figured I'd clean it up and release it, so here we are!

This thing uses variables (I love variables now), so changing colors is extremely easy. Changing fonts or background images is a bit harder, but if you have basic CSS knowledge, you should be able to hunt around for the stuff you want to change. There are only 4 sections to this, so the CSS shouldn't be super hard to decipher. (As always, my email is open for questions if you have any!)

Mobile compatibility

This version of the layout collapses into a single column on screens smaller than 800px wide. For the version with columns on all screen sizes, go here.

I pushed the menu to the bottom, but if you want it to display at the top of the screen, switch the order around at the bottom of the CSS.


Header 3

Header 4

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