幅が700ピクセルのtableを中央に配置しています。縦スクロールが出ない高さですと大丈夫なのですが、縦スクロールが出る高さにすると一緒に横スクロールも出てしまいます。(縦スクロールの幅分位だけ)
tableの幅を小さくしてもやはり、縦スクロールが出る高さにtableの高さを設定すると横スクロールが出てしまうのです・・。
どうすれば解決するのでしょうか??
もっと良い方法があるかと思いますが、
とりあえず横スクロールバーを表示したくないのであれば
下記で表示されないようにすることができます。
縦スクロールはスクロールが必要であれば表示されます。
<style type="text/css"></p> <p><!--</p> <p>table {</p> <p>overflow: auto;</p> <p>overflow-x: hidden;</p> <p>overflow-y: auto;</p> <p>}</p> <p>--></p> <p></style>
http://www.tagindex.com/stylesheet/page/overflow_hidden.html
同様の症状を経験したことがないので、検証せずにこたえてしまいますが、縦スクロールのみを表示させたいのであれば、tableをdivなりで囲んでoverflow:auto;とすれば実現できるかと思います。
tableの幅が上位のdivを超えてしまった場合の動作はわかりませんが。
ご返答ありがとうございます。
bodyのすぐ下に書いてtableを囲んだのですがうまくいきませんでした。
どこが違うのでしょうか??
どっか他の部分の幅100%設定などが影響しているようにも見えますが、ソースコードが分からないので具体的な原因を見抜くことは困難だと感じます。
HTMLとCSSのソースをお見せいただくことは出来ませんか?
説明不足ですみません。
overflow:auto;でスクロールを表示させる際は、tableを囲むdivのwidthを決め打ちしてください。この場合、縦のみ表示させるので、divのwidthはtable幅を超えない範囲(今回は700pxで良いかと思います)で指定します。
heightは指定しなくても大丈夫だと思いますが、色々試してみてください。
私には不思議に思える症状ですので、閲覧環境など教えていただければと思うのですが。
コメントがつけられませんので、もう一度回答欄から失礼いたします。
また、雑な回答をしてしまいまして申し訳ありません。
はてなの記入法がよくわかっていなかったようで、
入力したソースに余分なタグが入り込んでしまいました。(pタグ)
そちらはすべて省いてください。
念のために、リンク先の情報もご参照いただければ幸いです。
正しくはこちらのようになります。
overflow:hiddenにすると、縦も横も両方非表示になりますのでご注意ください。
また、マージンも設定するのであればもっとシンプルに書けますよ。
※下記は、マージン、背景色はテーブルに設定してあります。
<html>※ソース、ひとつずつ改行させたかったのですができませんでした。
はてなの書き方、よくわかりません・・・
ご返答ありがとうございます。
早速試してみたのですが。。うまくいきませんでした。
↓がソースです。{overflow}の書き込む場所はココで良いのでしょうか??
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>無題ドキュメント</title>
<style type="text/css"></p> <p><!--</p> <p>body {</p> <p> overflow: hidden;</p> <p> margin-left: 0px;</p> <p> margin-top: 0px;</p> <p> margin-right: 0px;</p> <p> margin-bottom: 0px;</p> <p> background-color: #333333;</p> <p>}</p> <p>--></p> <p></style></head>