相对定位和背景

Question

当相对定位一个元素时，就它的父元素而言，它仍然处于没有相对声明的位置。这意味着父级块不会扩展到重新定位对象的位置。

在此示例中，大图片周围的浅蓝色/绿色背景和“海滨别墅”文本不会延伸到下面的栏（隐私和像我们一样，等等）。这是因为条使用相对定位。有没有一种简单的方法可以扩展矩形以覆盖底栏？

这是simplified version in jsFiddle。

Answer 1

我假设因为你依赖于html5标签，我可以忽略旧IE，所以我使用css box-sizing属性来简化它，代码并实现相同的效果。

http://jsfiddle.net/zpV3m/4/

即使您真的应该将它们更改回正常的十六进制值以获得IE8支持，我也会留下rgb颜色。

Answer 2

为什么不使用float: left; margin: X;
而不是position: relative; top: Xpx; left: Xpx;的组合 在此处查看示例http://jsfiddle.net/zpV3m/7/