32696


次のリンクからhtml5版プレイヤーに移動した後の、設定ボタンの色を変えようとしています。  
<http://www.nicovideo.jp/watch/sm8628149>  
cssで言うとここです  
→`<button class="ActionButton ControllerButton PlayerOptionButton"~~>`  
そこで、stylishにて

[code]

    .ActionButton svg{
        fill: #f90 !important;
      }
    
[/code]

としたのですが変更されません。  
インスペクターからもともとのcssのfillを無効化するとうまくいくことから優先順位の問題だと思うのですが、自分のコードをこれ(`!important`)以上に優先させることは出来ないのでしょうか？


CC BY-SA 3.0
2017-02-15T12:49:20.297
32687
2017-02-15T23:09:28.740
2017-02-15T12:51:56.700
5044
20533
question
html css svg
cssのsvgに対する優先順位について


HTMLのXML namespaceが`http://www.w3.org/1999/xhtml`なのに対し、[SVGのXML
namespace](https://www.w3.org/TR/SVG/intro.html#NamespaceAndDTDIdentifiers)は`http://www.w3.org/2000/svg`です。またCSS
Selectorにおいて[XML
namespaceを指定する](https://www.w3.org/TR/selectors/#typenmsp)には`|`を使います。

[code]

    @namespace url(http://www.w3.org/1999/xhtml);
    @namespace nssvg url(http://www.w3.org/2000/svg);
    
    @-moz-document domain("www.nicovideo.jp") {
      .ActionButton nssvg|svg {
        fill: #f90 !important;
      }
    }
    
[/code]


CC BY-SA 3.0
2017-02-15T23:09:28.740
32696
2017-02-15T23:09:28.740
4236
32687
answer