我有2 div
秒。父级div
位置relative
,子级div
位置fixed
。
如果我在父width
上使用一定数量的div
,则width: inherit;
效果很好。
当我在父width: 100%;
上使用div
时,子div
的父级width
比其父级*,
*::before,
*::after {
box-sizing: border-box;
}
.content {
position: relative;
background: black;
width: 100%;
}
.fixedElement {
position: fixed;
width: inherit;
background: yellow;
z-index: 2;
top: 0px;
}
多。
<div class="content">
parent
<div class="fixedElement">
child
</div>
</div>
&#13;
jQuery
&#13;
我在这里错过了什么吗?
我正在考虑使用width
设置孩子的css
,但我确定它不是一个好的解决方案,因为它只能用Element
。
答案 0 :(得分:4)
body
有默认margin
。因此,父元素将填充整个宽度,但由于该边距将受到限制。固定元素未绑定到body
,并且无论边距如何都是全宽。
但是,它突出显示在父级的右侧,因为它位于具有position: relative
的父级中。如果添加CSS规则,如
body {
margin: 0;
}
父母与子女的人数相同。
答案 1 :(得分:0)
因为您使用的是position: fixed
和top: 0
,所以子div
与您的父级重叠。如果您的孩子div
需要position: fixed
,并希望查看整个父元素,请尝试将position: fixed
添加到您的父级并添加一些top
值。这将在子元素下显示您的父元素。
或者另一种解决方案可能是更改父元素和子元素的位置,并对它们使用display: inline-block
答案 2 :(得分:0)
如果你想让子元素继承父元素的宽度,那么它应该是绝对位置而不是固定位置。