适合IE的适合内容的polyfill

Question

我在项目中使用fit-content作为CSS宽度。但根据this MDN article和this Can I Use的说法，在IE中，它不起作用。我在width: fit-content上使用<div>。这是否有一个polyfill？如果没有polyfill的另一种方式，我很乐意接受。

My code (severely stripped down):

var i = 0;
setInterval(function(){document.getElementById('total').innerHTML = `${++i} s`}, 1000);

#total {
  position: absolute;
  margin-top: 10px;
  margin-left: 10px;
  font: 300px "Times New Roman";
  border: 1px solid #000;
  max-width: 88.9%;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content; /* Doesn't work in IE */
}

<div id="total">0</div>

Answer 1

尝试删除width属性，默认情况下此属性设置为auto。

然后div会自动增加，代码如下：

<script type="text/javascript">
    var i = 0;
    setInterval(function () { document.getElementById('total').innerHTML = (++i) + " s" }, 1000);

</script>
<style type="text/css">
    #total {
        position: absolute;
        margin-top: 10px;
        margin-left: 10px;
        font: 300px "Times New Roman";
        border: 1px solid #000;
        max-width: 88.9%;
    }
</style>
<div id="total">0</div>

输出如下（使用IE 11）：