问题
In my HTML page I have a total of 3 menus :
- 1 on the left
- 1 on the right
- 1 in the middle above the content
The left and right menus are floating, and the middle content and menu have a margin equals to the width of the menus to center it.
This is working fine. However, when I insert some other floating content in my content block and I stop it with clear: both;, the next content I add is added below the side menu with the largest height.
Here is a simple fiddle that shows the issue : http://jsfiddle.net/Xy9Ry/
As you can see, the other content text is displayed below the left menu instead of being displayed just below the floating content.
What can I do to solve this problem ?
回答1:
Add overflow: hidden; to .content
JSFiddle Demo
w3c Wiki article on Overflow
overflow: auto; also works
来源：https://stackoverflow.com/questions/19053254/floating-menus-disturbing-my-floating-content