selectタグの矢印がfirefoxだけ消えない問題を解決する
CSSデザインで、オシャレなプルダウン(selectタグ)を作ろうとすると
こんな感じになるはず。。。
>|css|
select{
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
}
||<
firefoxでデフォルトの矢印を消すと、
こんな感じに逆三角の矢印マークが残ります。
これを消したい...
そんな時はこれ。
selectタグに下記のオレンジを追加しましょう
>|css|
select{
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
text-indent: .01px; /*Firefox用*/
text-overflow: ""; /*Firefox用*/
}
||<
結果はこうなった。
うん、おっけ!
より詳しい内容はこっちのブログにと、、