I'm adding a fancier menu system to my CMS, and have bumped into a problem with drop down menus.

The way the CSS is designed is that is has horizontal rows of DIVs, within which you can create colums (of DIVs) into which the content goes.

That means you can put a menu anywhere on the page you like, and a page can have many menus if that's what you want on your web page. However, in looking at this drop down menu issue, that seems to create a problem.

Let's say my first row is
<div>Menu goes here</div>
The second row is then
<div style='float:left; width:50%'>some content</div>
<div style='float:left; width:50%'>some other content</div>
<div style='clear:both'></div>

I'm looking at the drop menu solutions/tutorials on line, and what I suspect that when the menu drops down, it will expand the div in which it's encased, which will then move the next dive down. Obviously, that's not what I'm looking for.

Can anyone suggest a way to create drop down menus so that they can still be encased in a div, yet can expand the actual menu without effecting the row below?

Thanks CTB