父元素設置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;
}