Why won't wrapper div expand when it has an absolute child div

问题

I have a wrapper div set to 960px and inside it, I have another div called "slider". Slider is positioned absolutely in the middle of the screen using this code:

#slider {width:390px; height:100px; position:absolute; 
         margin:-100px 0 0 -200px; top:50%; left:50%; border:1px solid;}

I have added borders to both the wrapper and slider divs so that I can see how they are positioned on the screen however, this has revealed that the wrapper is not expanding to contain the absolute slider div.

How do I fix this so that the height of the wrapper is correct?

回答1:

When you use position:absolute; on an element it is position outside of the document flow and does not impact on the other content.

If you can, remove position:absolute; and use other methods to center your slider div. If you need the position:absolute; then it is not possible.

来源：https://stackoverflow.com/questions/13268044/why-wont-wrapper-div-expand-when-it-has-an-absolute-child-div