Menu Placing
A left sided Menu
So you want to move your column of links to the left hand side ? Keep reading then !
The above is what you have now.
This tutorial will take you through moving first the menu, then the header, then the middle bit where you post. All it involves is changing the file ’style.css’ in a few (well, quite a few) places.
This tutorial, unlike the others, involves more changing of numbers. While the numbers I give will work for what you see, they may not be exactly right for you. If they aren’t, then change them little by little until they do work for you. It will work in the end 
Move the menu
In style.css is this part;
#menu {
background: #fff;
border-left: 1px dotted #ccc;
border-top: solid 3px #e0e6e0;
padding: 20px 0 10px 30px;
position: absolute;
right: 2px;
top: 0;
width: 11em;
}
Now the bit we will change is the right: 2px; part. Change the word right to left. If you now look at your weblog, it’s a mess like this;
Now there is nothing wrong there, the code is still fine, but we do need to shift the stuff from behind the newly placed menu.
Move the header
We’ll move the weblog title first. Strictly speaking, we are not actually moving the header. We are just moving that part of the header that you want to see. So that’s the title then.
Look at your css again, and find this part;
#header {
background: #90a090;
border-bottom: double 3px #aba;
border-left: solid 1px #9a9;
border-right: solid 1px #565;
border-top: solid 1px #9a9;
font: italic normal 230% ‘Times New Roman’, Times, serif;
letter-spacing: 0.2em;
margin: 0;
padding: 15px 10px 15px 60px;
}
We just need the bottom line of that statement.
Try changing that number 60 into 260. You should now see that your weblog title has been moved into view.
Okay, so that’s the header bit sorted.
Make the Content content
The soon-to-be-altered part of the css is this;
#content {
margin: 30px 13em 0 3em;
padding-right: 60px;
}
I suppose it’s about here that I try to explain what an ‘em’ is. Hmm, okay then.
An ‘em’ is equal to an ‘M’ in the font you are using.
So a horizontal space of ‘13em’ in this font would be the same width as MMMMMMMMMMMMM - because that’s 13 M’s. Bigger font ? Bigger space .. get the idea ?
So why use ‘em’ here and not pixels like we do pretty much everywhere else ? Because we want what we write to have a nice, straight, unruled edge to it. We want the left side of our paragraphs to be neat. There, that’ll do eh ? Right ……
So, an explanation of the above #content css.
Your content will have margins around it, and going from top - right - bottom - left they are 30px, 13em, 0 (none) and 3em.
Now look again at the image above.
The top and bottom margins are fine, and can stay the same. The left margin is too big though, and so is the right.
If the page worked the other way around though, it should work this way if we switch the numbers, so swap the 13em and the 3em.
And you should now see this;
There you go - job done !
