div not positioning correctly

I have 2 divs, each开发者_Python百科 has a background image and I want them to line up side by side. But for some reason they are coming up vertically, whereas I want them horizontally.

Code for both the divs is below. How can I fix this?

#header
{
top: 40px;
width:310px;
height: 90px;
background: url(Images/logo.jpg) no-repeat;
}
#logo
{
top: 40px;
left: 3200px;
height: 100px;
background: url(Images/banner.jpg) no-repeat;
}

<div id="header-container">
<!-- stick your HTML here -->
</div>

    #header-container { overflow:hidden; zoom:1; }

Modify your css to add these properties:

    #header { float:left; } 
    #logo { float:left; width:[the width] }

This assumes they are siblings and they aren't inside of each other.

    <div id="header-wrapper">
    <div class="header">hello</div>
    <div class="logo"></div>
    </div> 

and ur css:

/* this width = .header + .logo + any left or right padding on them.. or it can be 100% */   
   #header-wrapper {width: 1000px;}   

   .header {background: url(Images/logo.jpg) no-repeat; width:500px;height:90px;float:left;}
   .logo {background: url(Images/banner.jpg) no-repeat;width:500px; height:90px;float:left;}

That should work also, havent tested so let me know if it doesn't