- 締切済み
IEと同じようにFirefoxでもテーブルが表示されるには？
head内にスクロール非表示のタグを入れています。 http://aomi1111.sakura.ne.jp/temp/in/i106/index.htmlのような感じでノーフレームです。 IE7、IE6ではテーブルが画面の上から下まで表示されテーブル内でスクロールが出来ますが、Firefoxで見るとテーブルが画面下に飛び抜けてしまいテーブル内のスクロールが出ず、スクロール非表示にしてるので下が見れなくなってしまいます。上のサイトのように表示するにはどうすれば良いでしょうか？このテンプレートをノーフレームにしたいです。自分なりに(初心者です)いじくりすぎて原形がなくなりました。必要なさそうな(？)タグは載せていません。 ■CSS■ body,td,th{ font-size:70%; color:#444; font-family:Georgia,Verdana,Osaka,'MS P Gothic'; font-weight:normal; margin:0px;padding:0px; background:#fff url() repeat fixed; } body{text-align:center;} table{margin:auto;height:100%;} #table2{ filter:alpha(opacity=100); width:551px;height:100%; background:#fff; padding:0px 10px 0px 10px; overflow:auto; } #table3{ filter:alpha(opacity=90); background:#fff url() no-repeat; padding:0px; width:220px;height:100%; } ■top.html■ <head> <style type="text/css"> <!-- body{overflow:hidden;} --> </style> </head> <body> <★table cellspacing="0"> <tr><td> <div id="table2">左の本文</div> </td><td> <div id="table3">右メニュー</div> </td></tr> </table> </body> ★のtableを消してcssの#table内にfloat:left;margin-left:120px;等入れるとFirefoxでも表示されますが、その場合table2、table3を真ん中にこさせる方法が解りません。。。どなたか解る方がいましたらよろしくお願い致します。
- みんなの回答 （1）
- 専門家の回答
みんなの回答
- Yohjira
- ベストアンサー率66% (14/21)
table2のheightを固定長（例えば500とか）にしたら、 スクロールバーがでたりしませんか。 IEだとスクロールバーが出なくなるようでしたら、 overflow:auto;の記述をoverflow-y:scroll;に変えてみたりとか。 ウィンドウサイズの変更に応じて、 table2のheightを変更するような処理も必要になるかもしれませんね。
お礼
ご回答ありがとうございます！とても嬉しいです。 IE7のウインドウサイズに合わせてhight:592px;にしてみました。 overflow:auto;のままでもスクロールは表示されました。 Firefox(少しはみ出し)、IE6(画面より小さめ)、大きいモニタサイズなどだと表示が変わるのか少し気になります。。（わがままでごめんなさい 泣）他に方法がなさそうでしたらこれで行こうと思います。 ★のtableを消すとウインドウサイズの変更に応じてスクロールされるようなので、これでtable2、table3を上手く真ん中にすることが出来ればいいのですがそれはやはり無理でしょうか？ ＞ウィンドウサイズの変更に応じて、 ＞table2のheightを変更するような処理も必要になるかもしれませんね。 ！！そんな方法があるのですか！？もし良ければ教えて頂けないでしょうか？いろいろとすみません…。
補足
他のテンプレートを参考にして、 CSSの#tableを#mainに変更し #all{text-align:left;width:790px;height:100%;margin:0px auto;padding:0px;}のタグを足すと、どのブラウザでみても変わりなく表示することが出来ました！ずっと悩んでたのですがやっとで解決しました（涙） この度は回答頂きありがとうございました！