CSS を使用して 2 つの Div を並べて配置するにはどうすればよいですか?

CSS で 2 つの Div を並べて配置

2 つの隣接する div を作成することは、一般的なレイアウト要件となる場合があります。これを実現するには、次のアプローチを検討してください:

Flexbox:

このソリューションでは、flexbox はdivを調整するために採用されました水平方向:

<h1 id="親">親 {</h1><p>表示: flex;<br>}</p><h1 id="狭い">狭い {</h1><p>幅: 200px;<br> 背景: ライトブルー; /<em> 見えるようにするためです </em>/<br>}</p><h1 id="wide">wide {</h1><p>flex: 1; /<em> コンテナの残りの部分まで成長します </em>/<br> 背景: ライトグリーン; /<em> 見えるようにするためです </em>/<br>}<br></p>

<div> <div id="wide">ワイド (残りの幅)</div>
<br> <div></div>
<br><p>この方法では、左側の div (#narrow) に固定幅を指定し、右側の div (#wide) が自動的に占有されるようにすることができます。残りのスペースは画面幅いっぱいになります。</p>
</div>

以上がCSS を使用して 2 つの Div を並べて配置するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。