为什么我的包含span比我的svg更大？

Question

为什么我的包含span比我的svg更大？

7

我有一个嵌套在中的svg。svg设置了height和width为15px。

<span>
    <svg xmlns="http://www.w3.org/2000/svg" id="remove-circle" viewBox="0 0 1200 1200.0071" width="15px" height="15px"><path d="..."/></svg>
</span>

我将svg包裹在一个span中，以便更容易地定位它，但是这样它的height为19px。我尝试将line-height设置为0，但没有改变任何东西。我需要做什么才能使span与svg大小相同？

- jhamm

你的CSS中是否还有其他类别在起作用？ - blurfus

<span style="height:15px;"> - JM-AGMS

这是一个使用CSS模块的React组件，因此不应该有任何与CSS相关的问题。 - jhamm

2

这个修复了吗？https://dev59.com/IWAf5IYBdhLWcg3wdCh1 - Michael Coker

@JM-AGMS，它仍然会将2像素添加到高度... 看起来是另一个问题，如上面的评论所提到的。 - blurfus

尝试使用<span style='height:15px; display:table'>...</span>或者table-cell，或者只是简单地使用inline-block。 - zer00ne

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Andy Hoffman · Accepted Answer

我能够在本地重现此问题，并通过将以下CSS应用于周围的来修复它。

span {
  display: inline-flex;
}