HTML头部logo,html - Logo in the header - Stack Overflow

I'm currently trying to get a logo to appear side by side with my header, I can target the logo background just fine however when I try to change the header color it doesn't allow me to. I have tried changing the float to left right and center, center is the best to me personally. Any idea as to why I can change the header color? I posted the code below.

Title

body {

min-width: 630px;

}

#container {

padding-left: 200px;

padding-right: 190px;

}

#container .column {

position: relative;

float: left;

}

#center {

padding: 10px 20px;

width: 100%;

}

#left {

width: 180px;

padding: 0 10px;

right: 240px;

margin-left: -100%;

}

#right {

width: 130px;

padding: 0 10px;

margin-right: -100%;

}

#footer {

clear: both;

}

* html #left {

left: 150px;

}

#container {

overflow: hidden;

}

#container .column {

padding-bottom: 1001em;

margin-bottom: -1000em;

}

* html body {

overflow: hidden;

}

* html #footer-wrapper {

float: left;

position: relative;

width: 100%;

padding-bottom: 10010px;

margin-bottom: -10000px;

background: #fff;

}

body {

margin: 0;

padding: 0;

font-family:Sans-serif;

line-height: 2.24em;

}

p {

color: #000000

}

nav ul {

list-style-type: none;

margin: 0;

padding: 0;

}

nav ul a {

color: white;

text-decoration: none;

}

#header {

font-size: large;

padding: 0.3em;

background: #000000;

}

#footer {

font-size: large;

padding: 0.3em;

background: #e4e2e2;

}

#left {

background: #d3d2d2;

}

#right {

background: #d3d2d2;

}

#center {

background: #e4e2e2;

}

#container .column {

padding-top: 1em;

}

.header img {

width: 250px;

height: 80px;

float: center;

background: #ffffff;

}

.header h1 {

position: relative;

top: 18px;

left: 10px;

}