I have a horizontal div which is inside my header and is the width of my header. In this div I want to put 3 other divs of different sizes and line them all up together. I've tried everything and they keep falling outside the horizontal div.

It would seem that I could just use floats, but they wouldn't work. The three divs are represented in the image by black, pink and white backgrounds. They are enclosed in login-breaking and are named login, search and breaking-marquee The site is down right now while I get this working but if you need to see it live I can open it up for you.

Here's my header section:

/* Header Section */

/* Header Section */

#header {	
	margin:0px auto;
	background-color:#e2e2e2;
	width:1024px;
	height:151px;		
}

#header-logo {	
	float:left;
	width:225px;
	height:77px;
	background:url({site_url}images/uploads/stfuandplaylogo.gif);
	background-repeat:no-repeat;
	margin:45px 40px 0px 28px;	
}


#login-breaking {
	width:1024px;
	height:35px;
	background-color:red;	
	margin:0 auto;
	
	
	
	}

#login{
	width:166px;
	height:35px;
	background-color:pink;
	border-left:#ffffff;
	margin-top:0;
	margin-left:333px;
	float:left;
	
	}
	
#search{
	width:333px;
	height:35px;
	background-color:#000;
	margin:0;
	margin-left:0;
	float:left;
	}

	
#breaking-marquee {
	width:525px;
	height:35px;
	background-color:#ffffff;	
	margin-left:499px;
	float:left;
}

#breaking-marquee p{
	color:red;
	font-family: 'Press Start 2P';
	font-size:10px;
	margin-top:10px;
	margin-left:5px;
	display:inline;	
}

#breaking-marquee bm{
	color:black;
	font-family: 'Press Start 2P';
	font-size:12px;
	}

	
#navbar{
	width:1024px;
	height:28px;
	background-color:#000;
	position:relative;
	top:123px;
	background:url({site_url}images/uploads/nav-gradient.jpg) repeat-x;
	}
	
	

Here's an image of what it looks like:
divprobs

Here's the html:

<div id="content-wrap">
<div id="header">
	
<div id="header-logo"></div>
	<div id="login-breaking">

    		<div id = "search"></div>
		<div id = "login"></div>
		<div id = "breaking-marquee"><p>BREAKING:<bm>MICROSOFT</bm></p></div>
		
		
	</div>	
	
    <div id = "navbar"></div>