Css 继承宽度不为';不能使用百分比值
我有两个Css 继承宽度不为';不能使用百分比值,css,Css,我有两个divs。父div具有相对位置,子div具有固定位置 如果在父级div上使用统一的width,width:inherit工作正常。 当我使用宽度时:100%
div
s。父div
具有相对位置,子div
具有固定位置
如果在父级div
上使用统一的width
,width:inherit代码>工作正常。
当我使用宽度时:100%在父div
上,子div
的宽度大于其父宽度
*,
*::之前,
*::之后{
框大小:边框框;
}
.内容{
位置:相对位置;
背景:黑色;
宽度:100%;
}
.固定元素{
位置:固定;
宽度:继承;
背景:黄色;
z指数:2;
顶部:0px;
}
父母亲
小孩
正文
有一个默认的边距
。因此,父元素将填充整个宽度,但会由于该边距而受到限制。固定元素不绑定到主体
,并且是全宽,与边距无关
但是,它突出在父对象的右侧,因为它位于父对象中,父对象的位置为位置:relative
。如果添加CSS规则,如
body {
margin: 0;
}
父项和子项大小相同。因为您使用的是位置:固定和顶部:0
子项div
与父项重叠。如果您需要您的孩子使用position:fixed
并希望查看整个父元素,请尝试将position:fixed
添加到您的父元素中,并添加一些top
值。这将在子元素下显示父元素
或者,另一种解决方案是更改父元素和子元素的位置,并对它们都使用显示:内联块
如果您希望子元素继承父元素的宽度,那么它应该是绝对位置,而不是固定位置。这实际上在小提琴上起作用,但在现场margin:0
设置为body
-——这正是原则。当一个元素的位置固定时,它不会与其父元素绑定到相同的限制。您使用位置固定
而不是绝对
的原因是什么?这是一个菜单栏。当我向下滚动200px时,它的位置被固定,因此它将粘在顶部。您是否尝试使用left:0px;右:固定元件上的0px(或类似物),而不是宽度
?这样你就可以让它填满屏幕,而不管屏幕的颜色如何parent@Hans你是救命恩人。不知道为什么我从没想过<代码>左:0px
实际上工作起来很有魅力!我知道它可以很好地与绝对值
配合使用,但我需要它具有位置:固定代码>尝试将正文边距重置为0。正文{页边距:0;}