CSS：将段落元素与包含SVG的跨度对齐

Question

我有一个<p>元素出现在一组SVG上方，这些SVG包含在<span>元素中，如下所示。我希望包含SVG的范围与文本“问题1”对齐。

我尝试过的事情：

• 我发现没有与此对齐冲突的边距或填充。
• 段落文字的行高为0。
• 两者都未设置为display: block;，而是设置为display: inline;

我还在这里包含了问题的简化版本（注意只有一个图标，因为SVG使其更难以遵循）：https://jsfiddle.net/qt3c2m49/

Answer 1

首先，你的段落应该被赋予line-height等于你想要它占据的空间（在这种情况下为30px）。

清除浮动广告时，您实际上是将其删除到新行，因此请从clear: both;

移除.newTopicAnswerIcons

你的图标都有margin-top 25px，这会将你的图标向下推，所以请改为0。

jsfiddle