一つのdivの中に、二つのdivがあるとき、
二つのdivの片方を310px;で指定して、
もう片方を、画面サイズにあわせて可変するようにするにはどうしたらよいですか？
310pxで指定したところは、内容などがはみ出さないようにしたいです。(つまり、二つの内容同士がはみ出さないようにして欲しいです。)
CSSのソースはこちらです。
div#content{
width: 100%;
}
div#1{
float: left;
}
div#2{
width: 310px;
float: right;
}
HTMLは、上記の通り、一つのdivに二つのdivが入っている状態になっています。
<div id=”content”>
<div id=”afl1”>
</div>
<div id=”web1”>
</div>
</div>
No.1
804
34
http://www.hatena.ne.jp/1136094147
人力検索はてな - CSSで、 一つのdivの中に、二つのdivがあるとき、 二つのdivの片方を310px;で指定して、 もう片方を、画面サイズにあわせて可変するようにするにはどうしたらよいですか？ ..
div#1{
float:left;
position:absolute;
padding-right:310px;
}
div#1を上記にすれば、WindowsのIE、Firefox、OperaではOKです
No.2
3020
CSS:
div#content{width:100%;}
div#web1{width:310px;float:right;}
HTML:
<div id=”content”>
<div id=”web1”>
test
</div>
<div id=”afl1”>
test
</div>
</div>
でしょうか。
これで左側が可変で310pxが収まらなくなれば縦に並ぶようになっています。
ただ#afl1と#web1の順番が逆転してしまいますが・・・
No.3
20
Yahoo! JAPAN
class属性にしてみてはいかがでしょう？
【CSSのソース】
div.content{
width: 100%;
}
div.afl1{
float: left;
width: 100%;
}
div.web2{
width: 310px;
float: right;
}
【HTMLタグ】
<div class=”content”>
<div class=”afl1”>
</div>
<div class=”web2”>
</div>
</div>
これらの方法がすべて、私の意図するものではなかった上に、これ以上回答があつまりそうにないので、キャンセルします。
6
3
2
2
1
回答ありがとうございます。
しかし、これだと
内容があふれた場合に、
よこにあふれてしまいます。
できれば、横ではなく、縦に自動的に改行されるようなものにしたいのです。