当我们应用位置：固定到一个元素，它取为文档的
out of the normal flow，因此它不尊重它的父元素宽度。
有没有办法使它继承它的父宽度，如果这被声明为一个百分比？ (下面的工作用例)
有没有办法使它继承它的父宽度，如果这被声明为一个百分比？ (下面的工作用例)
let widthis = $('.Box').width();
$('.dimensions').text(`width is ${widthis}`);
$('button').on('click',function() {
$('.Box').toggleClass('fixed');
let widthis = $('.Box').width();
$('.dimensions').text(`width is ${widthis}`);
});
.container {
max-width: 500px;
height: 1000px;
}
.Box {
background-color: lightgreen;
}
.fixed {
position: fixed;
}
.col-1 {
border: 1px solid red;
float: left;
width: 29%;
}
.col-2 {
border: 1px solid pink;
float: left;
width: 69%;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click this to toggle position fixed for the left column</button>
<div class="container">
<div class="col-1">
<div class="Box">
fixed content<br>
<span class="dimensions"></span>
</div>
</div>
<div class="col-2">
some other content
</div>
</div>
解决方法
可以使用width：inherit。这将使它听父母。我测试它，它在Firefox中工作。
