右の浮動 div がラップする理由:
もちろん、右の浮動 div がラップする理由はたくさんあります。初心者が犯しがちな間違いを次に示します。
コード例:
<!DOCTYPE html><html><head><meta charset="utf-8"><meta name="author" content="http://www.softwhy.com/" /><title>蚂蚁部落</title><style type="text/css">div{ width:200px; height:100px; background:blue;}#right{ float:right;}</style></head><body><div id="left"></div><div id="right"></div></body></html>
上記のコードでは、2 番目の浮動 div に改行があります。
多くの友人は、右側の div はフローティングであり、改行なしで最初の div の右側に配置できると考えていますが、実際には、最初の div は別の行を占有しているため、2 番目の div はフローティングであるにもかかわらず、これは間違いです。浮いてしまうと改行も発生します。最初の div が left float に設定されている限り、2 つの div は 1 行に表示されます。
元のアドレスは次のとおりです: http://www.softwhy.com/forum.php?mod=viewthread&tid=15669
詳細については、以下を参照してください: http://www.softwhy.com/divcss/