html - 右の div は可変幅、左の div は残りの幅

Question

div2 を含む可変幅の(.container) がありますdivs。右側div(.div-submit) は、使用する言語に応じて可変幅です。左div(div-textarea) を調整して、左側の残りのスペースをすべて取得します。フレックスボックスを使用せずにこれを達成するにはどうすればよいですか? 以下のコードとこのjsfiddleを参照してください

<div class="container">
    <div class="div-textarea">
        <textarea id="txtarea" placeholder="This  is a textarea"></textarea>
    </div>
    <div class="div-submit">
        <input type="submit" value="Post">
    </div>
</div>

右の幅は固定されていないため、このdivようなソリューションは機能しないこと に注意してください。

ありがとう。

Answer 1

例を使用してみてくださいdisplay:table;：

.container{
background-color: green;
display:table;
}

.div-textarea{
display:table-cell;
background-color: blue;
opacity: 0.5;
width:100%;
}

.div-submit{
display:table-cell;
background-color: red;
opacity: 0.5;
}

お役に立てれば！

*編集*

div-text areaとdiv-submitを別の div でラップし、表示をdisplay:table-row;