Firefox Stylish 1.2.4のCSSが表示されない理由と解決方法

このQ&Aのポイント
  • Firefox Stylish 1.2.4のCSSを記入するテキストエリアが表示されません。iframe{ display:none !important;}の指定が原因かもしれません。
  • 以前のバージョンでは表示されていたのに、今のバージョンでiframeを採用したため表示されないのでしょうか?解決方法として、Stylish自身を例外指定する方法があります。
  • 具体的なセレクタについてはわかりませんが、iframe:not([style*="display:"]){ display:inline !important;}というセレクタを使用することもできます。他のセレクタでも問題ありません。
回答を見る
  • ベストアンサー

Firefox Stylish 1.2.4のCSS

Firefox Stylish 1.2.4のCSSを記入するテキストエリアが表示されません。 理由は、 iframe{ display:none !important;} 自体を指定している為だと思いますが、毎回無効化すると表示されるので・・・ (前バージョンのStylish 1.2.3までは有効でも表示されていましたので、 今バージョンでiframeを採用したのでしょうか?・・・) それで、 解決方法をしては、Stylish自身を例外指定とすれば良いのですが、 iframe{ display:none !important;} @-moz-document ○○○○ { iframe:not([style*="display:"]){ display:inline !important;} } この ○○○○ 部分のセレクタが分かりません・・・ または、その他のセレクタでもOKです。  ご教授下さい。

質問者が選んだベストアンサー

  • ベストアンサー
  • neddoheny
  • ベストアンサー率60% (921/1528)
回答No.1

残念ながらこのカテで、CSSを本当に理解して回答出来る回答者は極めて少ないです。 ググってリンク先をただ貼るだけの、某マルチID回答者ならいますけどね。。 さて、本題。 >今バージョンでiframeを採用したのでしょうか? はい、その通りです。 >この ○○○○ 部分のセレクタが分かりません・・・ セレクタは、 @-moz-document url-prefix(chrome://stylish/content/edit.xul) です。 但し、質問者さんの書いたコードに入れて、 iframe{ display:none !important;} @-moz-document url-prefix(chrome://stylish/content/edit.xul) { iframe:not([style*="display:"]){ display:inline !important;} } と記述してみても、効果ないです。 ということで、色々コードの書き方はあるかもしれませんが、個人的には @-moz-document url-prefix(エイチttp://),url-prefix(エイチttps://){ iframe{ display:none !important;}} で、一応解決しました。当方検証済み。 [注意] 上記のコードの中の、「エイチ」の文字2か所とも、半角のhに置き換えてから記述してください。(このサイトではリンクっぽいURLで回答文を投稿したら文字化けしてしまうので敢えて、エイチと書きました)

naokita
質問者

お礼

「なるほど」と唸ってしまいました。 httpの発想が浮かびませんでした・・・ お陰で即対応する事ができました! ありがとうございます。

関連するQ&A

  • FirefoxのStylish について

    現在いくつかのサイト閲覧時の表示レイアウトを変更するために Stylish にて自作の定義を作っているのですが cssを理解していないこともあり(基本的に全く理解してません) どうしても自己解決ができずに悩んでいる点があります もしわかる人がいたらどんな書き方すれば対処できるのかを教えてください (もしくはどう頑張っても対処不可のものがある?) 使っているアドオンとしては 他に FireDebug と Adblock Plus(以降Adblock表記) があり とりあえず現状は合わせ技で対処してますが可能であれば 現在 Adblock にて非表示にしている部分を Stylish 管理にしたいと思っています 内容 Firedebugにて htmlの項目として以下の定義がなされている部分を height 0 もしくは非表示 に変更したい(そのスペースを詰めたい) <li Style=”float:left;width:728px;margin-left:8px;height:110px;"> (データ的には該当領域には広告画像が表示されます) ・Firedebug上からのスタイル変更はできています(確認にしかならない) ・AdBlock にて 以下の定義で 非表示にすると対応はできています サイト名##LI[style="float:left;width:728px;margin-left:8px;height:110px;"]   ↑ の事から height 0 でも非表示でもどちらでもできればいいと考えています ですがこれをStylish側で対処させようとしてもうまくいきません 試したこと 1.Firedebug にて 標準の element.style { height が効いているようだったので   そのままそれをコピーしてheight:0 !important; を追加   (他のサイトでそのような書き方で変わるところもありました) 2.他のパターンでできている #や.の定義と同様にしてdisplay: none !important; を追加 3.FireDebug で階層を開いていくと <div class=”クラス名” の定義もあったので   (他のものは大抵その記載で非表示にできている)   そのクラス名でdisplay: none !important記載追加     この場合 FireDebug で確認すると サイズが変更されているので     別のものになってしまっているように思える ※ 上記 コピペなどしているため記載ミスがあるかもしれませんが   stylish上でのお試し時にエラーは出ていません なんとなくStylishだけではどうあがいても変更不可能の場合があるのではないかと思っていますが どうなのでしょうか

  • Firefoxのタブバー

    Firefoxのタブバーを非表示にしたい。 検索して、userChrome.cssで「.tabbrowser-strip { display: none !important;} 」としましたが、消せませんでした。 どうすれば消せますか。

  • firefoxをフラットにカスタマイズ

    firefoxを「Stylish」というアドオンを使用してカスタマイズしております。 クラシックなスタイルにしているのですが、何かのきっかけで一部フラットではなくなってしまいました。 どのように手を加えればフラットになりますでしょうか? グラデーションなどをやめて、添付画像のタブ辺りのような感じにしたいです。 今のユーザースタイルはこのようになっております。 toolbox#navigator-toolbox { border-left: 1px solid ThreeDHighlight !important; } hbox#browser { border-left: 1px solid ThreeDHighlight !important; } hbox#browser .plain { -moz-appearance: listbox !important; } tabbrowser { background: ThreeDFace !important; } tab { -moz-appearance: tab !important; margin-top: 3px !important; } tab[selected="true"] { margin-top: 1px !important; } #searchbar .search-go-button{ display: none !important; } #bookmarksPanel treechildren::-moz-tree-image(container), #bookmarksToolbarFolderMenu, #bookmarksToolbarFolderMenu [container], .bookmark-item[container] { list-style-image: url("chrome://FOLDER_16x16-32.png") !important; -moz-image-region: rect(16px 128px 32px 112px) !important; } sidebarheader { -moz-appearance: none !important; background: black !important; border: none !important; }

  • firefoxのブックマークの検索の部分の虫眼鏡を

    firefoxのブックマークの検索の部分の虫眼鏡を消したい firefox12.0を使っております。 アドオン「Stilish」を使用し、windowsXPのクラシックスタイルと色を変えるソフトでカスタマイズしております。 firefoxのバージョンが新しくなり、ブックマークのところに検索の入力フォームができました。 こちらに表示される虫眼鏡が不要ですので消したいです。 Stilishにどのように記述すればいいでしょうか? また、できればブックマークのフォルダアイコンも消したいです。 よろしくお願いいたします。 以下stilishに記述してある全文です。 toolbox#navigator-toolbox { border-left: 1px solid ThreeDHighlight !important; } hbox#browser { border-left: 1px solid ThreeDHighlight !important; } hbox#browser .plain { -moz-appearance: listbox !important; } tabbrowser { background: ThreeDFace !important; } tab { -moz-appearance: tab !important; margin-top: 3px !important; } tab[selected="true"] { margin-top: 1px !important; } #searchbar .search-go-button{ display: none !important; } #bookmarksPanel treechildren::-moz-tree-image(container), #bookmarksToolbarFolderMenu, #bookmarksToolbarFolderMenu [container], .bookmark-item[container] { list-style-image: url("chrome://FOLDER_16x16-32.png") !important; -moz-image-region: rect(16px 128px 32px 112px) !important; } sidebarheader { -moz-appearance: none !important; background: black !important; border: none !important; } .tab-icon-image { display:none !important; }

  • CSSを利用して、特定のリンクや画像を非表示にしようと思っています。

    CSSを利用して、特定のリンクや画像を非表示にしようと思っています。 img[src="画像URL"] {display:none !important;} a[href^="URL"]{display:none !important;} これで、Opera、Firefox、Safariではできたのですが、 IE6ではできません。 IE6で有効な方法を教えてください。

  • CSSに詳しい方お願いします

    FirefoxアドオンのStylishを使ってCSSをいじっています。 下記のURLで検索結果のタイトルと本文見出しのボックスを 画面右端まで伸ばしたいと思っています。 はてなブックマーク http://b.hatena.ne.jp/search/text?q=%E3%83%AC%E3%83%93%E3%83%A5%E3%83%BC CSSはこのアドオンを使い始めてからちょこっとだけ学んだもののまだまだ初心者です。 li.search-result h3 {width:100% !important} こんな感じに書いてみても反応がありません。(display:none すると消えるのですが) CSSに詳しい方「タイトルと本文の右端まで伸ばす方法」を教えて下さい。

    • ベストアンサー
    • CSS
  • FirefoxのCSSで勉強がてら広告ブロックをしているのですが、Pe

    FirefoxのCSSで勉強がてら広告ブロックをしているのですが、Personas for Firefoxで表示される「Personasへようこそ」部分が消せません。 element.style { display:block; } Firebug上で、display:noneにすると消えるため場所は間違いないとは思うのですが、どのように記述したら良いのか宜しくお願い致します。よければ、ドメイン指定から記述して頂けると勉強になります。

  • FireFox ユーザーCSSのカスタマイズ について、よろしくお願い

    FireFox ユーザーCSSのカスタマイズ について、よろしくお願いします。 ページ内検索バーを表示することを目的とし、 設定用CSSファイルの userChrome.cssの最終行に #FindToolbar{ display: -moz-box !important; } のIDを追加しましたが、検索バーが自動的に表示しません。(作用しない) 何かが足りないでしょうか? FireFox v3.6 windows7X64 のX86フォルダにインストールしています。(x86モード) profileは、Roamingディレクトリ以下にあります。 このCSS設定は以下を参考に行いました。 CSSの記述には間違いはありません。 /* */のコメントアウト方法も理解しています。 http://firefox.geckodev.org/index.php?%E3%83%A6%E3%83%BC%E3%82%B6%E3%83%BCCSS%E3%81%AE%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA よろしくお願いします。

  • Firefoxでタブのクローズボタンを非表示に

    Firefox91(現時点最新版)を使っています。 各タブにフォーカスすると出てくるクローズボタンを表示しないように出来ないでしょうか?アドオンを使う方法でも良いです。 検索しても古いバージョンの情報しかないです。 userChrome.cssに下記を書いてみましたが効かず。 .tabbrowser-tab .tab-close-button { display: none !important; } about:configの、browser.tabs.closebuttonsも、もちろん駄目です。

  • 閲覧時に背景色、文字色をcssで変更したい

    WindowsXP、Firefox3を使用しています。 白背景に黒文字という一般的なウェブページの配色はまぶしいので、 Stylishというアドオンを使ってcssで背景色、文字色を変更しようと思い、 以下のようなcssを作成しました。 ------------------------ここから body { color: #696969 !important; background-color: #dcdcdc !important; background-image:none !important; } td { color: #343434 !important; background-color: #d3d3d3 !important; background-image:none !important; } ------------------------ここまで しかし、これだと色が変更できない領域があります。 例えば、 http://www.yahoo.co.jp/  ……一番下?の背景色しか変わりません http://www.4gamer.net/   ……一切変化しません http://www.flay.com/    ……背景色は変わりますが、文字色が変わりません アドオンを使わず、userContent.cssを使う方法にしても結果は同じようです。 どのウェブページでも背景色と文字色を変更するには、どう記述すればよいのでしょうか?

専門家に質問してみよう