2 column div 1 fixed width 1 expand to fit

[jsisson2001]

Hello,

I'm rebuilding a website, and I need some help with the header.

So far I have a parent div that spans 100%.
I have 2 child divs within it, the first holding a small flash file at a fixed width. I need the second div to expand across what's left of the page, but I'm running into an issue. When the page gets to a certain size, the div bumps itself down. Not sure what I'm doing wrong. I understand the concept of the div doing that, but I don't want it to bump itself down.

Thanks for the help.

[almostbob]

show the code you are using

[jsisson2001]

(CSS)

#masthead{
	width: 100%;
	background-color: #AEACAC;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

#homelink{
	float:left;
	width: 210px;
	height: 120px;
	cursor:pointer;
	padding-left: 5px;
	clear:both;
}

#banner{
	background-image:url(images/banner.jpg);
	float: left;
	height: 120px;
	overflow: hidden;
}





(PAGE)


<div id="masthead">
	<div id="homelink" onclick="location.href='http://www.moldcontrol.com/'">
  		<script type="text/javascript">
			"Flash Object"
      		</noscript>
  	</div>

	<div id="banner">
	</div>
</div>

[jsisson2001]

OK, change of plans. I've set up the header the way I want it now.
Now I still have the issue of DIV wrapping. I have 4 child divs now, the flash, 1 static image, 1 static image (dynamic size with minimum width value), and 1 more static image.

<!-- CSS -->

#masthead{
	width: 100%;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	overflow: hidden;
	white-space: nowrap;
	float: left;
	position: relative;
}

#homelink{
	float:left;
	width: 210px;
	height: 120px;
	cursor:pointer;
	padding-left: 5px;
}

#banner-left{
	background-image:url(images/banner-left.jpg);
	float: left;
	height: 120px;
	width: 50px;
	white-space: nowrap;
	overflow: hidden;
}

#banner-right{
	background-image:url(images/banner-right.jpg);
	float: right;
	height: 120px;
	width: 300px;
	white-space: nowrap;
	overflow: hidden;
}

#banner-center{
	background-image:url(Images/banner-center.jpg);
	height: 120px;
	background-repeat: repeat-x;
	width: auto;
	min-width: 210px;
	overflow: hidden;
	white-space: nowrap;
}




<!-- HTML -->

<div id="masthead">
  <div id="homelink" onclick="location.href='http://mylink.com/'">
	<script type="text/javascript">
                 "Flash Object"
        </noscript>
  </div>
 
  <div id="banner-right"></div>  

  <div id="banner-left"></div>
  
  <div id="banner-center">another flash object or animated gif may go here</div>
</div>