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

CSS で 2 つの div を並べて配置する方法

ラッパー内で 2 つの div を並べて配置するには、次のようにします。フローティングなどの CSS テクニックを利用できます。以下にいくつかの効果的な方法を示します。

Floating One Div

次の CSS を追加します。

#wrapper {
    overflow: hidden;
}
#first {
    float: left;
}
#second {
    overflow: hidden; /*Prevent wrapping below #first*/
}

Floating #first div を左に配置します。 #second に隣接しています。

両方浮動小数点数Divs

または、両方の div をフローティングすることもできます:

#wrapper {
    overflow: hidden;
}
#first {
    float: left;
}
#second {
    float: left;
}

ただし、このメソッドでは、ラッパーに overflow: hidden を指定して、フローティングされた子を強制的に含める必要があります。そうしないと、ラッパーが空に見え、div の周囲の境界線が欠けている可能性があります。

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