How do I get a wrapper div's background-color to expand with the height
css, html
Solution
Remove the fixed height on the wrapper and add `overflow:auto` to it.
jsFiddle example.
Problem
I have a div that wraps a number of actions a user can take. This div is like an actionBar that you'd see at the top of a table. It has 3 elements: 1) a button group, 2) a group of selects and 3) pagination controls. I have the first two elements floating left and the last one floating right. This works great and everything lines up great when the browser window is wide enough to fit everything. However, when the screen resolution is smaller or the user makes the browser too narrow, the elements wrap. The wrapping I like, but the div does not expand its height (and associated background color) to fit the wrapped elements. How do I make the div expand its height to fit these wrapped elements. See the problem in action at http://jsfiddle.net/mraible/bJQCL/.