How To Move The Twenty Twelve Sidebar to the Left

moving sidebar in twenty tweve theme
The blue highlighted “right” is about to be changed to “left”

I have just installed Twenty Twelve as Magazine Basic is doing funny things with my image map. But there is GUI to modify the layout of the page. So I had to delve into the dreaded CSS stylesheet!

Fortunately moving the sidebar to the left is easy in the TwentyTwelve theme. Here’s how you do it:

  • Go to the theme editor, from Appearance > Editor select Style.css at the bottom (it is usually auto-selected).
  • Find the .site-content and .widget-area lines of CSS
  • Change the .site-content to float: right;
  • Change the .widget-area to float:left
  • Save it. Hey presto!

This will probably work in many other themes too.