Header with floated divs and css dropdown menu

[jgonyer1]

I’ve been trying to get this to work for a while now. Here’s the basic idea of what I’m going for:
example
I’ve managed to get the red div floated and get the blue div to fill the rest of the space. However, that uses overflow:hidden and I need the dropdown menu to appear.

Any thoughts?

[jgonyer1]

As an update: I ended up setting the main wrapper to display:table and the inner divs to display: table cell. Seems to be working, but it feels wrong to me. Any other thoughts would be much appreciated.

[Hornebom]

there is actually no need for floats. see this approach http://codepen.io/Hornebom/pen/dhDFt

[Paulie_D]

I hate using positioning when there are better, more flexible and responsive options available.

Just my personal opinion.

@jgonyer1 Do you have an image of what this is supposed to look like?

[Author]

Posts