Question

I have 2 divs, each 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;
}

Answer 1

<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.