I need a little help with some CSS

[benparko]

Hey

I am helping my girlfriend make a blog and doing some basic HTML and CSS to customise it. However, I cannot seem to center the banner. It's off to the right.

The blog is at BenAndIdaBlog (http://www.benandida.blogg.se)

If someone could PLEASE edit this style sheet to fix the banner so it's centered that would help me out a lot!

Thanks!!

Once you're done with editing the code, just reply with the new code. :)

Here's the code:


body {
font: 12px/16px Verdana, Arial, Sans-serif;
background: url('bg.jpg');
}

a {
color: #068991;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}

h1,h3,h4,h5,h6, div.navheader, div.default {
font-family: Verdana, Arial, Sans-Serif;
color: #222;
}

div#side h3 div.navheader {
color: #666;
}

div#wrapper {
margin: 20px auto 20px auto;
width: 800px;
padding: 10px;
background-color: #FFF;
}

div#header {
float: left;
clear: left;
display: inline;
width: 1000px;
height: 400px;
margin-top: 20px;
background-image: url(http://benandida.blogg.se/images/2010/banner_109823489.jpg)

}

div#content {
float: left;
padding: 0 20px 20px 20px;
width: 550px;
}

div#side {
width: 180px;
padding: 0;
float: right;
}

div#side div.navheader, div#side h4, div.default {
padding: 20px 0 5px 0;
font-size: 18px;
font-weight: normal;
}

div#foot {
background-color: #CCC;
height: 40px;
padding: 20px;
}

/* hide calender - doesn't work anyway */
div#side div#calendar {
display: none;
}

div#header h1 {
font-size: 45px;
font-weight: normal;
}

div#header h1 a {
text-decoration: none;
color: #FFF;
}

div#header h2 {
font-size: 12px;
margin-top: 15px;
color: #FFF;
}

div#content h3 {
font-size: 24px;
font-weight: normal;
margin: 20px 0 20px 0;
}

div#content div.entrybody {
margin: 10px 0 20px 0;
}

div#content div.entrybody ul {
margin: 10px 0 10px 15px;
}

div#content div.entrybody li {
font-size: 12px;
color: #222;
list-style-type: square;
}

div.default {
margin: 0 0 15px 0;
}

div.nav input {
margin-right: 5px;
}

div.nav ul {
margin: 5px 0 5px 5px;
padding: 0;
}
div.nav li {
list-style: none;
padding: 2px 0;
}

div.nav ul li strong {
line-height: 37px;
font-size: 11px;
}

div.entrymeta {
font-size: 11px;
margin: 0 0 20px 0;
padding: 10px 0 10px 0;
color: #666;
line-height: 7px;
}

div.commentheader, p.commenttext {
margin: 0 0 0 15px;
font-weight: bold;
color: #222;
}

p.commenttext {
font-weight: normal;
}

div.commentmeta {
color: #666;
margin: 5px 0 20px 15px;
font-size: 11px;
}

form.commentform {
font-size: 11px;
}

form.commentform input, form.commentform textarea {
margin: 0 5px 10px 0;
vertical-align: middle;
}

input.formbutton {
margin-top: 10px;
}

.separator {
display:none;
}

.subside {}

.image {
border: 0;
margin: 0 6px 6px 0;
}

.thumbnail {
margin: 0 6px 6px 0;
}

.video {
padding: 0;
}

.xmlButton {
border: 1px solid;
border-color: #FC9 #630 #330 #F96;
padding: 0 3px;
font: bold 10px Verdana, Arial, Helvetica, Sans-serif;
color: #FFF;
background: #F60;
text-decoration: none;
margin:0;
}

.clear {
clear: both;
}