html – CSS:使用margin / padding将Div拉伸到其父级高度的100%

前端之家收集整理的这篇文章主要介绍了html – CSS:使用margin / padding将Div拉伸到其父级高度的100%前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

目前我在这个页面上工作(见图1)

我需要在文章div上制作阴影,由于浏览器兼容性,我不能使用Box-shadow属性.
所以我们将背景分为3个这样的部分,

直到我们将背景图像从包含浅蓝色背景颜色的JPEG更改为PNG才很好.
在我们更改图像文件之前,我可以使用z-index属性. (将中间部分的高度设置为100%并将顶部/机器人部件放在上面)
但是,因为我用PNG改变它因为PNG的不透明性而显得很奇怪.

底线是 – 我需要做这样的事情:

但是当我使用margin-top / bottom属性将中间部分的高度设置为100%时,
这就是我所拥有的(小提琴:http://jsfiddle.net/EaBxP/):

它应该适用于IE6,我不能只使用JPEG,因为设计师想要做评论评论框阴影的文章.
提前致谢.

编辑:文章div的高度是隐含的所以我不能只设置中间部分的高度.

最佳答案
使黄色div相对于容器绝对定位.通过设置顶部和底部而不指定高度,div将获得容器的高度.

div.background-mid {
    position: absolute;
    top: 20px;
    bottom: 20px;
    left: 0px;
    right: 0px;
    background-color: yellow;
}
原文链接:https://www.f2er.com/html/425815.html

猜你在找的HTML相关文章