父元素设置transform: scale3d(1, 1, 1);
transform
是把fixed
降级成absolute
处理了,所以子元素宽度能自适应。参考CSS3 transform对普通元素的N多渲染影响
子元素width:calc(100% - border- padding - margin );注意calc运算符前后均需一个空格 参考 CSS calc() 函数
兼容:Chrome、Firefox
<div class="col-md-3 left-ztree" style="height:100%;">
<hr class="line-blue">
<div class="ztree-box" style="height:98%; overflow:auto;"></div>
</div>
.left-ztree {
transform: scale3d(1, 1, 1);
position: relative;
min-height: 1px;
padding-right: 15px;
padding-left: 15px;
}
.line-blue {
height: 8px;
background: #0c4ea2;
position: fixed;
width: calc(100% - 40px);
margin-left: 5px;
}