重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

【GOLF me！】初月無料お試し

firefoxでスクロールバーが二重に出てしまいます。

解決済

  • 質問者：atsushix
  • 質問日時：
  • 回答数：3件

初めて自分でXHTML+CSSでサイトを作ろうとしている者です。
bodyの直下に「div id="container"」を置き、containerをCSSで
#container {
margin:0 auto;
overflow: auto;
background-color:#fff;
width :90% ;
height:100%;
}
としています。

この時、containerの右側と下側に、スクロールバーが出現してしまいます。
通常のブラウザのスクロールバーに加えて内側にスクロールバーが二重になってしまっている状態です。

質問ですが、どうすればこの内側のスクロールバーを消せるのでしょうか？

ちなみにOSはXP、ブラウザはfirefoxです。（IE6で見た時は内側のスクロールバーは出ません）

このままだと相当格好悪いので、何とか直したいと思っています。
どなたかご教示頂ければ幸いです。

よろしくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (3件)

No.2ベストアンサー

  • 回答者： MAN_MA_RUI
  • 回答日時：

ovarflow:auto;が使われているためにスクロールバーが出ているわけですが、何故ここでこれを使用しているのかが良く分かりません。

    • good
    • 0
    • 件
通報する
この回答へのお礼

解決しました！ありがとうございました。

>何故ここでこれを使用しているのかが良く分かりません。

お恥ずかしい話ですが、どこかのテンプレからコピってきたものをそのまま使ってました・・・

通報する
お礼日時：2007/03/29 19:56

No.3

すみません。

当方環境で再現させることができません^^;;
インストーラが嫌いなので以下のFirefox 2.0.0.3 私的ビルド(Visual C++ 2005 SP1 (PGO))のEXEの7-zipを解凍してC:\Program Files\ においた後
http://www1.plala.or.jp/tete009/software.html

上記2.0.0.3を-pオプション付きで起動して普段とは別なプロファイルを作りました。

その後，Firefox 2.0.0.3で以下のソースを読み込ませて見ましたが，再現しませんでした。何か手順間違えてたら突っ込んでください

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …
<html xml:lang="ja" xmlns="http://www.w3.org/1999/xhtml" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>サンプル</title>
<style type="text/css">
#container {
margin:0 auto;
overflow: auto;
background-color:red; /* 色はわかりづらいので意図的に変更しています */
width :90% ;
height:100%;
}
</style>
</head>
<body>
<div id="container">
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
<p>ほげ</p>
</div>
</body>
</html>

この回答への補足

ごめんなさい、ちょっと分かりません。
実際は外部CSSファイル中にcontainer以外にも様々な指定がありますが・・・
わざわざお手数おかけしてしまい、ありがとうございます。

補足日時：2007/03/29 19:53
通報する
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： mazimekko3
  • 回答日時：

body {


width:100%;
height:100%;
overflow:hidden;
}

を追加する。

この回答への補足

お答え頂き、ありがとうございます。
追加してみましたが、外側のスクロールバー（通常のブラウザのバーです）が効かなくなっただけで、内側のバーは消えませんでした。

補足日時：2007/03/29 19:52
通報する
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

今、見られている記事はコレ!

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報