【CSS】ボタンの内側右にアイコンを配置する方法

CSS

頻繁に案件で使うので備忘録としてメモ。

See the Pen
Untitled
by ゆーじろー (@yuji64)
on CodePen.

aタグの中にspanを入れ、spanの右側にmarginを指定しておくことで、ボタン幅が小さくなってもテキストとアイコンが重ならないようになります。

positionでアイコンを配置するとアイコンが浮いてしまってテキストと重なってしまうので、背景画像でアイコンを表示する方がいいかなと思います。