floatでの回り込みを防ぐ
-
0 名前: 流 : 2005/05/31 00:36
- テーブルを並べてみたのですが右側のテーブル(※下のテーブル2)が画面サイズを小さくしてみると、回りこんでしまって左のテーブル(※下のテーブル1)の下に表示されてしまいます。
横スクロールがあってもいいので、画面サイズを小さくしても回りこみを防いで横に表示されるようになる方法がありましたら教えてください。ソースは以下の通りです。
<DIV STYLE="float: left;">
<table class="sample2" STYLE="solid; float: left; margin: 20px 3px;" bgcolor=#FFFFFF BORDER="1" BORDERCOLOR="#000099" WIDTH="530" CELLSPACING="0" CELLPADDING="3">
<tr><td bgcolor=#000099><b><FONT Color=white>テーブル1</b></FONT></td></tr>
<tr><td>
内容
</td></tr></table></DIV>
<table class="sample1" STYLE="solid; float: left; margin: 20px 3px;" bgcolor=#FFFFFF BORDER="1" BORDERCOLOR="#4169E1" WIDTH="250" CELLSPACING="0" CELLPADDING="3">
<tr><td bgcolor=#4169E1><b><FONT Color=white>テーブル2</b></FONT></td></tr>
<tr><td>
内容2
</td></tr></table>
ではお願いします。
-
1 名前: phpinfo() : 2005/05/31 00:36
- プラウザで表示させましたが回り込みは発生しませんでした。
#あとスタイルシートを使うならfontタグなどの見栄え要素は使わないように。
-
2 名前: 流 : 2005/05/31 00:36
- ご回答有難うございます。
やはりお気に入り等が表示されている部分を広くしてみると右テーブルが左テーブルの下に移動してしまいます。
こういうのを防ぐ指定などは無いのでしょうか?
>#あとスタイルシートを使うならfontタグなどの見栄え要素は使わないように。
できれば欠点などを教えていただければ幸いです。
-
3 名前: tk : 2005/05/31 00:36
- ブラウザのページ表示部分の横幅を狭めると横に並んでたのが縦に並んじゃうってことで良いんでしょうか
bodyに横幅を指定もしくは横並びにしておきたい部分をdivで囲って横幅を指定してみたらどうでしょう?
<body><<<=ここか
<div> <<<=ここに横幅を指定
<DIV STYLE="float: left;">
<<略>>
</td></tr></table>
</div>
</body>
スタイルシートはwebページの見栄えの為に使うもので、スタイルシートが分かるなら見栄えをいじる部分は全部スタイルシートでやってしまいましょう、と言う事かとおもいます。