我有这个例子http://jsfiddle.net/HnfCU/ 我使用jQuery来显示和隐藏.child
div
。 .child
被绝对定位到.parent
我试图解决的问题是.child
的高度。位置:绝对和高度
我想要.child
的背景来覆盖它的整个区域。现在,使用height:100%
它部分覆盖它。我无法使用固定高度,因为内容是动态的。
任何方法,css或javascript [jQuery]都可以接受,或者对结构进行任何更改。
我有这个例子http://jsfiddle.net/HnfCU/ 我使用jQuery来显示和隐藏.child
div
。 .child
被绝对定位到.parent
我试图解决的问题是.child
的高度。位置:绝对和高度
我想要.child
的背景来覆盖它的整个区域。现在,使用height:100%
它部分覆盖它。我无法使用固定高度,因为内容是动态的。
任何方法,css或javascript [jQuery]都可以接受,或者对结构进行任何更改。
如果我理解正确的话,除去bottom: 5px
和height: 100%
会得到你想要的东西:http://jsfiddle.net/blineberry/HnfCU/1/
这使得.child
从其内容获取其高度。
@Sotiris,不客气。 – Brent
只需从.child
样式中删除bottom: 5px;
样式即可。
它将子div的底部放置在父div底部的上方五个像素,但由于您已将子div的顶端放在父div的底部以下,因此会导致负高度,因此浏览器只是将高度设置为最接近的可能值,即零。
也删除height: 100%
样式,因为这只会让孩子与专利相同的高度,因为您不会在父级内显示孩子,所以您不希望这样做。
你一定要只是让'.child'的子元素'位置:absolute',作为计算'.child'的高度时,他们没有被包括在内,因为他们没有绝对的定位好。如果你只是添加'.child * {position:absolute}',它会包含这些子元素被backgorund包围,但是你必须做一些额外的样式来获得正确的间距。 – jerluc
@jerluc感谢您的回答。 '.child'的子元素被包围,因为使用'position:absolute',他们将会在'.child'的左上角。但是使用'top'或'margin-top'或'padding-top'移动它们也会将它们移出''child'的背景。 – Sotiris