Best way to center website?

Pretty new to css and html
drubiano.github.io

here is my website, ive been playing around with it to get it how I want but how it is now, it doesnt seem like the best way to 'center' it. Ie, currently when you resize window it doesnt look very good. Any help appreciated and any resources to learn how to position blocks better would also help a lot.

body {
    background-image: url("spacebg.jpg");
    }

nav {  
  
    position: fixed;
    height: 100%;
    width: 200px;
    top: 0;
    left: 1210px;
    border-right: 10px solid black;
    background-color: #404853;
    list-style-type: none;
    }
nav a {
  
    text-decoration: none;
    color: white; }
nav li {
    text-align: center; }

.info {
    background-color: #B8C5D1;
    height: 100%;
    position: fixed;
    top: 0;
    left: 500px;
    width: 700px;
    border-left: 10px solid black;
    color: black }
.info h1 {
    text-align: center; }
  

Code (markup):

 

put everything inside a div in html (ex:<div id="container">...your site..</div>), CSS - #container { width:700px; margin:auto;} hope it helps.
Search for responsive layouts or media-queries for resizing issues.

 

If you want it to look good when you resize window then you are looking for responsive technique. Here is one great video tutorial of how to create responsive design http://net.tutsplus.com/tutorials/html-css-techniques/responsive-web-design-a-visual-guide/ that will center no matter how big or small screen is.

let me know if that helps

 

thanks for replies, messed around with it some more

body{
margin-bottom: 120px;
background-image: url("spacebg.jpg");
}

.content {
float: right;
height:100%;
background-color: #B8C5D1;
color: black;
width: 600px;
}

.content h1 {
text-align:center;
}

nav {
height:100%;
text-align: center;
float: left;
width: 200px;
list-style-type:none;
background-color: #404853;
}

nav li a {
color: #fff;
text-decoration: none;
}
nav li a:hover
{
background-color: #369;
color: #fff;
}

.container {
width:800px;
margin:auto;
}

Code (markup):

I cant make the height: 100% work so backgrounds fill in all the way down the page

 

Take off the height:100% and just give it a fixed height if you're not looking for a Responsive view. Also, it's not good practice to add a margin-bottom to the body class.