YouTubeに横スクロールバーが出てしまう FF

質問

Firefox最新版。WinXP。画面解像度1024*600。ブラウザ表示倍率100%。
今週のYouTube改変で、ブラウザに横スクロールバーが出るようになってしまいました。
ブラウザウィンドウ最大化しても全画面表示してもYouTube内でどういう画面状態にしても常に出続けます。画面の横幅が20pxほど足りないようです。

画面が縦600pxしかないので、横スクロールバーは非常に邪魔です。
ブラウザ表示倍率は下げたくないです。
何か回避方法はないでしょうか？

回答No.6

ORUKA1951 · ベストアンサー

実際には、Youtubeのスタイルシートを詳しく解析して、ウィンドウ幅に合わせて伸縮できるようにするのがよいのでしょうが、Youtubeは頻繁にマークアップやスタイルシートが変更されるため、付き合いきれません。

　別のアプローチですが、たとえば、
html,body{
width:100%!important;
overflow-x:hidden!important;
}
body:hover{overflow:auto!important;}
とすることで、ポインターをウィンドウから外すとスクロールが消えるようにはできます。

その他、工夫次第で色々・・・

お礼

本当にありがとうございます。

やってみましたが、スクロールバーを消すためにマウスポインタをウインドウの外に動かすのは手間なので、結局、回答＃５のコードを採択することにしました。

YouTubeはブラウザで拡大表示することはあまりないので、横スクロールが出来なくても良しとすることにします。
縦６００ｐｘの画面では横スクロールバーが出るのは非常に邪魔ですからね・・・

（Operaは横スクロールバーが出ないので良いですね。動作も軽いし。しかしFirefox＋各種アドオンに慣れてしまうと、いろいろキビシイです）

補足

事後報告をカキコします。
回答＃５のコードを使ってみると、YouTube内で動画のサムネイルが表示されなくなる（全部ではないけど大体ページ内の頭から１／３以降はサムネイル真っ黒）
・・・という不具合が出ることが分かりました。
userContent.css を外すと解消します。

どうしてなのか皆目見当付きませんが、一応ご報告だけしておきます。
ありがとうございました。

回答No.5

ORUKA1951

なら、
@-moz-document domain(www.youtube.com){
html,body{
width:97%!important;
overflow-x:hidden!important;
}
}
https://またはhttp://のいずれでも
@-moz-document domain(www.youtube.com){
html,body{
width:97%!important;
overflow-x:hidden!important;
}
}

ドメインでまずけりゃ

@-moz-document url-prefix(http://www.youtube.com/){
html,body{
width:100%!important;
overflow-x:hidden!important;
}
}
@-moz-document url-prefix(https://www.youtube.com/){
html,body{
width:100%!important;
overflow-x:hidden!important;
}
}
ですかね。

お礼

ありがとうございます。
一番最後に提示して頂いたコードで概ねＯＫでした。

一点だけ気になるのですが・・・
スクロールバーを非表示にすると、スクロール自体が出来なくなる、というのは回避不能なのでしょうか？
後学のためにもぜひ知っておきたいと思いまして。

わがまま言ってすみませんが、よろしければご回答お願いします。

回答No.4

ORUKA1951

すみません。
@-moz-document url(http://www.youtube.com/){
html,body{width:90%!important;
overflow-x:hidden;
}
}
@-moz-document url(https://www.youtube.com/){
html,body{width:90%!important;
overflow-x:hidden;
}
}
でした。
　テストしたときのままで、縦スクロールを生かすのでしたら、x軸だけhiddenでした。

　ユーザースタイルシートは色々使えるので覚えておくと良いと思います。
スタイルシートの優先順位は
ユーザーの最重要宣言＞著者の最重要宣言＞著者の通常宣言＞ユーザーの通常宣言＞ブラウザの宣言
　です。!importantで最重要宣言になります。
　私はgoogleの背景画像のサービスがなくなったのでgooleの背景画像を指定したりしています。
@-moz-document url(https://www.google.co.jp/){
body{width:100%;height:100%;
background:url(file:///I:wallpaper/milky_way.jpg)!important;
background-size:cover!Important;
}
}

お礼

ありがとうございます。
overflow-x:hidden;
↑これにより横スクロールバーだけを非表示にしているのですね？

右側に描画されない真っ白な無駄な領域が出来てしまうので、
html,body{width:90%!important;
上記の部分は100%にしました。

しかし、今気づいたのですが、このコードはYouTubeトップページにしか機能しないのですね・・・
再生ページで効果がないとあまり意味が無いと思いました（すいません失礼言って）
URLの指定部分を
(https://www.youtube.com/*)
みたくアスタリスクでワイルドカード指定みたく出来ないものでしょうか？

回答No.3

ORUKA1951

Firefox4以降は無いようですね。
　私はそれ以前の0.7当りから継続してfirefoxなので知りませんでした。
\[英数文字].default\にchromeフォルダーを作成してください。
★Firefox 4.0 からは、chromeフォルダが無くなった :: Firefox Fan Club + More Browsers ( http://doheny.blog137.fc2.com/blog-entry-85.html )

お礼

ありがとうございます。
ご指示の通りchromeフォルダを作り、先程の.cssファイルを入れました。
その結果YouTubeでは・・・
・横スクロールバーだけでなく縦スクロールバーも消えてしまった。
・カーソルキーによる移動も含めて一切のスクロールが出来なくなってしまった。

これでは全然意味がありませんでした・・・なので元の環境に戻しました。
せっかくのご回答ですが、あきらめた方がいいのかも知れませんね・・・

回答No.2

ORUKA1951

profileフォルダーはインストールしたときの環境で変わります。
firefoxをすべて閉じて--タスクマネージャーから閉じていることを確認して
スタートメニュー→ファイル名を指定して実行に[firefox -p]と入力するとプロファイルマネージャーが起動します。
　使用しているプロファイルにポインターをあわせるとフォルダーへのパスが表示されるはずです。
　私は、D:にインストールしていてプロファイルはE:にありますが、通常はC:proguram filesにインストールされていて、プロファイルはC:\Document and settingsの下にあるのではないかと思います。

　その中にあるuserContent.css、なければメモ帳で作成して名前をuserContent.cssにして保存する。

　firefoxを再起動するとＯＫです。

お礼

ありがとうございます。
ご指示の通りプロファイルフォルダ確認しましたが、先程のお礼欄に書いたとおりでした。
C:\Documents and Settings\゜\Application Data\Mozilla\Firefox\Profiles\4cnmdj92.default

念のため再度C:\Documents and Settings の中を検索しましたが、userContent.cssというファイルは見つかりませんでした。

下記フォルダ以下にあるChromeフォルダは今回の質問とは無関係ですよね？
C:\Documents and Settings\゜\Application Data\Mozilla\Firefox\Profiles\4cnmdj92.default\extensions\

該当するChromeフォルダが見当たらないので、
C:\Documents and Settings\゜\Application Data\Mozilla\Firefox\Profiles\4cnmdj92.default
このプロファイルフォルダ直下に回答＃１にある通り次のような内容でuserContent.cssを作り、キャッシュ削除、Firefox再起動しましたが、横スクロールバーは消えませんでした。
@-moz-document url(http://www.youtube.com/){
html,body{width:100%!important;
overflow:hidden;
}
}
@-moz-document url(https://www.youtube.com/){
html,body{width:100%!important;
overflow:hidden;
}
}

Chromeというフォルダを作らなければいけないのなら、場所はどこになるのでしょうか？

回答No.1

ORUKA1951

Firefoxに限らず、どのブラウザでもスライドバーはでますね。そういうスタイル指定になってますよ。

　Firefox限定ですが裏技を・・・無理やりスクロールバーを出さない方法

firefoxのプロファイルフォルダー内のChromeフォルダーにあるuserContent.cssに次を加えます。ただしウィンドウを小さくしてもスクロールは出ません。
@-moz-document url(http://www.youtube.com/){
html,body{width:100%!important;
overflow:hidden;
}
}
@-moz-document url(https://www.youtube.com/){
html,body{width:100%!important;
overflow:hidden;
}
}

お礼

ありがとうございます。しかし、
C:\Documents and Settings　の中を *.css で検索してみたのですが、そのようなファイルは見つかりませんでした。

また、Chromeというフォルダですが、下記フォルダ内にそれらしきChromeというフォルダは見つかりませんでした。
C:\Documents and Settings\゜\Application Data\Mozilla\Firefox\Profiles
C:\Documents and Settings\゜\Local Settings\Application Data\Mozilla\Firefox\Profiles

下記フォルダの中にあるChromeフォルダは無関係ですよね・・・
C:\Documents and Settings\゜\Application Data\Mozilla\Firefox\Profiles\4cnmdj92.default\extensions\

－－－
なお、Firefox、IE、Chromeはいずれも横スクロールバーが表示され、Operaだけは表示されませんでした。
以上報告です。