[解決済み] 入力「番号」に対して常に上下矢印を表示させることはできますか？

質問

入力欄(quot;number")に常に上下の矢印を表示させたいのですが、可能でしょうか？これは可能でしょうか？今のところ、うまくいっていません...。



http://jsfiddle.net/oneeezy/qunbnL6u/

HTMLです。

<input type="number" />

CSSです。

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {  

   -webkit-appearance: "Always Show Up/Down Arrows";

}

どのように解決するのですか？

Opacityプロパティを使用することで（少なくともChromeでは）これを実現することができます。

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button {  

   opacity: 1;

}

上記のように、これはおそらくChromeでのみ動作します。そのため、他のブラウザ用のフォールバックなしでこのコードを野放図に使用するのは注意が必要です。