如何使其他单元格的宽度成为剩余宽度的百分比？

<style>
    .container {
        display: flex;
    }
    .item {
        flex: 1;
    }
    .fixed-width {
        width: 100px;
    }
</style>

<div class="container">
    <div class="item">占据剩余宽度的元素</div>
    <div class="item fixed-width">固定宽度的元素</div>
</div>

<style>
    .container {
        display: grid;
        grid-template-columns: 1fr auto; /* 1fr表示占据剩余宽度的列，auto表示固定宽度的列 */
    }
    .item {
        grid-column: span 1; /* 占据剩余宽度的元素 */
    }
    .fixed-width {
        width: 100px; /* 固定宽度的元素 */
    }
</style>

<div class="container">
    <div class="item">占据剩余宽度的元素</div>
    <div class="item fixed-width">固定宽度的元素</div>
</div>