埋め込まれたSVGが要素に位置合わせされていません

私はPNGからSVGに移行しようとしていますが、苦労しています。埋め込みSVGを使用したいので、色のCSS属性を変更するだけでなく、リソースの負荷を減らすことができます。私が持っている問題はSVGが埋め込まれているときです。提供されたボックスの上に表示されますが、SVGにリンクしてimgタグを使用すると、フォーマットは完璧です。埋め込まれたSVGが要素に位置合わせされていません

私の写真では、左側のボックスが埋め込まれている間、右側のボックスにimgタグがあります。

http://jsfiddle.net/fLWhu/684/

<span> 
          @Html.Raw(File.ReadAllText(Server.MapPath("~/Content/images/icons/1.svg"))) 

</span> 
<span> 
<img src="~/Content/images/icons/1.svg" alt="our linked in" /> 
</span>

更新：

スパンに

 display:inline-block; 
    vertical-align:middle;

を加えた後、その結果です。インラインブロックと垂直整列：

出典

2017-06-09 Joshua Waring

SVG部分はOKと思われる、あなたはディスプレイを設定してみてください中央をdiv.header .RIGHT Pのスパン要素

出典

2017-06-09 02:13:23

はあなたに感謝し、ダウンさせなかったことSVG、それはまだ完全に整列されていませんし、少し高い位置に整列しています。私はすべてのCSSを見て、なぜそれを理解しようとしています。これはかなり一貫しています。私は、いくつかのパディングで問題を隠すことにします。 –

埋め込まれたSVGが要素に位置合わせされていません

答えて

関連する問題