ここでは、input要素でボタンに擬似要素を適用させたい方が参考になりそうなお話をします。結論から言うと、input要素に疑似要素は適用できません。

例えば、リンクタグならこういうデザインが素直に作れるわけですが（疑似要素で右に矢印を入れています）。

ボタンで表示を切り替えてご覧ください。

See the Pen button01 by kenichi (@ken81) on CodePen.

input要素をボタンにしたものでは同じように行きません。

See the Pen button02 by kenichi (@ken81) on CodePen.

上記は、inputタグに同じスタイルシートを適用させた例です。

input要素は置換要素といって少し特殊な要素のため疑似要素が効きません。でも、お問合せフォームなどで送信ボタンがinput要素になっている場合はどうしたらよいでしょうか。そういうときは、次のようにします。

See the Pen button03 by kenichi (@ken81) on CodePen.

どうしてもinput要素に疑似要素を入れたい場合は、inputをdiv要素などでラップして、それに対してにスタイルシートを組みます。これで、実装できましたね。