用浮点和边距定位问题

Question

这是我在jsfiddle http://jsfiddle.net/YG6tx/5/

上的例子

所以我的问题是，为什么红色div（pageWrap）没有达到内部元素的高度？

如果我指定float:left，则需要高度，但margin: 0 auto不再成立。

我怎么能同时实现？ （margin:0 auto + div需要占据高度。）

我是否需要明确指定height？

我是新手，所以这个问题看似简单。

Answer 1

只需将overflow:hidden提交给#pagewrap。

Answer 2

使用浮点数和绝对定位的元素进行设计很难......它们的父元素不会环绕它们，所以通常必须在父元素上指定height属性才能完成所需的外观。但是，.topLeft并不一定需要float:left;属性。如果你删除它我认为你会得到所需的外观。示例：http://jsfiddle.net/YG6tx/8/

Answer 3

试试这个更新的小提琴：http://jsfiddle.net/YG6tx/12/

正如你原来的小提琴一样，由于图像的路径不正确而没有图像所以在我的小提琴中也没有图像，但根据你的要求我改变了布局。

根据您的要求，图像位于位置，红色div按内部元素占据整个高度，中心也是边距：0 auto;

如果我在某些地方滞后请注释，以便我可以根据要求进行更改。