一般的なsvgのイメージ
ブラウザがsvg素材をラスタライズする都合で微妙にアイコンなどが見切れてしまう事があります。
ごく簡単な解決方法があるので書き残しておきます。
解決方法
ベクタ画像編集ツールで素材のページサイズより少し小さくして書き出します。
以上です。
なかなか解決せずにハマっていた
イマイチ原因を特定できずにcssをひたすらに弄っても解決出来ないので迷っていいました。
ラスタライズされるというところに気がつけば簡単な話で、あくまで素材のサイズ分のエリアにラスタライズされるので、いくらcssでmarginやpaddingを設定しても意味がなかったというわけでした。
素材自体に余白があれば、ラスタライズされて問題なく描画できるようになりました。