左
    
    

        右右右
    

記錄下兩種方法：

方法一：

.box {
    width: 200px;
    display: flex;
}

.left {
    background-color: red;
    width: 50px;
}

.right {
    background-color: yellow;
    flex-grow: 1;
}

這種方法有一個問題，當右邊的內容超過寬度，左邊會壓縮到只顯示內容。暫時不知道解決的辦法。

方法二：

.box {
    width: 200px;
    overflow: hidden;
}

.left {
    background-color: red;
    width: 50px;
    float: left;
}

.right {
    background-color: yellow;
    width: calc(100% - 50px);
    float: left;
}

?

?

?

?