Web デザインで固定幅の Div と残りのスペース Div に対応するにはどうすればよいですか?

固定幅 div と残りの div の対応

Web デザインにおける一般的な課題は、2 つの div に対応することです。1 つは特定の固定幅を持ち、もう 1 つは動的に変更する必要があります。残りのスペースを占有します。

CSS ベースのソリューション

CSS を利用する効果的なアプローチの 1 つ:

.left {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">width: 83%;

ログイン後にコピー

}

.right {

width: 16%;

}

この CSS 構成により、 .left div は使用可能な幅の 83% を占め、.right div は残りの 16% を占め、.left div の必要な固定幅が維持されます。

表示: テーブル メソッド

代わりに、display: table プロパティは強力な解決策を提供します。

<div class="right"> </div><br><div class="left"></div>

.left {</p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">display: table-cell;
width: 83%;

ログイン後にコピー