Css 引导4位置固定,宽度继承不工作
我有内容和侧边栏:Css 引导4位置固定,宽度继承不工作,css,twitter-bootstrap,bootstrap-4,Css,Twitter Bootstrap,Bootstrap 4,我有内容和侧边栏: .border{ 边框:1px纯黑; } 你好,世界! ..... .... 它工作正常,但需要注意的是,位置:固定具有相对于视口的宽度。因此,如果将20%设置为父元素,则固定元素将继承20%,而不会继承其父元素宽度的计算像素值 因此,两个元素都将具有20%,但并非两个元素都具有相同的百分比参考(即,并非两个元素都具有相同的包含块) inherit CSS关键字使为其指定的元素从其父元素获取属性的计算值 。。。但是,对于某些属性(其中百分比与可能需要布局来确定的内容相关
.border{
边框:1px纯黑;
}
你好,世界!
.....
....
它工作正常,但需要注意的是,位置:固定
具有相对于视口的宽度。因此,如果将20%
设置为父元素,则固定元素将继承20%
,而不会继承其父元素宽度的计算像素值
因此,两个元素都将具有20%
,但并非两个元素都具有相同的百分比参考(即,并非两个元素都具有相同的包含块)
inherit CSS关键字使为其指定的元素从其父元素获取属性的计算值
。。。但是,对于某些属性(其中百分比与可能需要布局来确定的内容相关,例如宽度
、右边距
、文本缩进
、以及顶部
),指定的百分比值将转换为百分比计算值
下面是一个基本示例来说明:
.box{
边框:2倍纯红;
最小高度:50px;
宽度:100%;
}
.box>div{
位置:固定;
宽度:继承;
最小高度:50px;
边框:2倍纯绿;
左:0;
}
身体{
填充:0 100px;
}
对于我来说,我计算要修复的列的百分比,然后按宽度百分比将其设置为css 例如,如果希望固定元素为col-md-2 这意味着您将在css中将宽度设置为2/12=16%!重要的;像这样
.fixedelement{width:16% !important;}
如果您有一个元素,但它的子元素有
位置:fixed
,子元素将只能从其上方具有位置:relative的元素继承属性值代码>确保.col-md-5.col-lg-3.border
具有位置:相对代码>。这些是CSS属性position
@DerkJanSpeelman中的基本行为典型性,我尝试过,但不起作用。。请检查并更新question@DerkJanSpeelman<代码>继承< /代码>不为定位位置,只考虑父/子关系。因此,即使父元素不是包含块,元素也将始终从DOM whataver位置的父元素继承继承始终来自文档树中的父元素。
()否。我有一个引导网格系统,没有固定的宽度。引导网格使用flexbox。我不能将宽度设置为固定元素,因为我不知道父元素的宽度。请看我的例子。和引导网格不使用宽度,它使用:最大宽度:25%@MafysGrif没有什么?谁谈到固定宽度?我知道你们有一个网格系统,我正在解释为什么它不工作。检查父元素的宽度,您将看到网格系统在中将其设置为宽度:100%
。col-lg-3
仅最大宽度:25%
@MafysGrif检查所有样式,您将发现所有类的宽度:100%
。为了证实我所说的,在固定元素中添加left:0
,你会看到它总是100%是的,你是对的。左:0工作在100%;但是我怎样才能解决我的问题呢?我需要为inherit column侧边栏做什么?我需要在位置固定得到边栏的宽度,但不是100%。。