- ベストアンサー
※ ChatGPTを利用し、要約された質問です（原文：css 各divの内容を上に揃えたいです。）
CSSでdivの内容を上に揃える方法
このQ&Aのポイント
- CSSでdiv要素内のコンテンツを上に揃える方法を知りたいです。
- 具体的には、<main>要素と<side2>要素の内容を上揃えにしたいです。
- また、ブラウザの大きさを変えても中央を基準にコンテンツが動くようにしたいです。
- saladadada
- お礼率38% (5/13)
- HTML
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは 【IE】 .middleの部分で .middle width:900px; margin-left:100px;でcontents幅は1000pxとなっていますが .main width:700px; margin-left:70px;と .side2 width:200px; margin-left:700px;で 合計1670pxとなっていますので.mainでfloat:left;してもcontents幅より大きいので下に追いやられてしまっているわけです #1様の言うようにmargin-leftを消すかその分だけdivの幅を減らすかしてください これで900pxとなりますが実際に横に並べる為にはcontentsの幅は903px必要になります これは<div>と<div>の間に見えない(消せない?)隙間があるためです 【Firefox,Opera】 IEでは.mainだけにfloat:left;すれば回りこみますがこちらは回り込まないので.side2にもfloat:left;を入れる必要があります（IEでも入れると900pxで並べられます） IEではmargin-leftした分だけcontents幅が増えますがこちらは増えませんのでmargin-left分だけcontentsより表示がはみ出ることになります paddingでした場合も同様 このはみ出しを表示させないようにするにはcontentsにoverflow:hidden;をいれます
その他の回答 (1)
noname#56851
回答No.1
divに付いているmargin-leftは全部取ってしまう。 side2にfloat-leftを追加。 これで上手くいくと思います。 下のサイトに色々と解説があるので目を通しておいて下さい。
