floatの使い方
すごく初歩的な質問をさせて下さい。
DW5.5を使用しております。
「contents」というdivの中に「main_1」と「main_2」というdivを入れたいのですが、
floatを使用するとcontentsの下側に回ってしまいます。
「main_1」を左寄せに、「main_2」を右寄せにして「contents」内にはめるには
どのようにすればよいのでしょうか？
どなたかご教授下さい。
＜＜ソース＞＞
<body>
<div id="contents">
<div class="main_1">
</div>
<div class="main_2">
</div>
</div>
</body>
＜＜css＞＞
*{
margin:0px;
padding:0px;
}
img{
border:none;
}
li{
list-style-type:none;
}
body{
font-size:12px;
line-height:1.4em;
font-family:"ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif;
background-color: #333333;
margin:0px auto;
}
/* FireFox リンク選択時の点線を消す */
a{
overflow:hidden;
outline:none;
}
/* FireFox flashの境界の点線を消す */
object{
outline:none;
}
#contents{
width: 940px;
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
background: #000 url(../img/con_main.png) repeat-y;
padding-top: 42px;
padding-left: 60px;
}
.main_1{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
padding-left: 40px;
width: 550px;
float: left;
height: 500px;
}
.main_2{
font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
float: right;
width: 296px;
padding-right: 30px;
height: 500px;
}
お礼
みなさんご回答ありがとうございました。 回答数が少ないようなので ここで締切りしますお疲れ様でした