删除内联 span 元素的填充
我有两个内联元素。您可能会假设它们完全相同，只是其中一个的位置设置为绝对并且位于另一个的下方。像这样：
<body style="text-align: center;">
<span style="background-color: #000; color: white; font-size: 300px; line-height: 1; padding: 0; position: relative;">
AAA <span style="background-color: #333; color: white; font-size: 300px; line-height: 1; padding: 0; position: absolute; top: 100%; left: 0;">AAA</span>
</span>
</body>
小提琴： http://jsfiddle.net/CSPFL/5/
当然，全屏小提琴： http://jsfiddle.net/CSPFL/5/show/
跨度不一样 高度！静态跨度具有某种填充。是否可以删除此填充而不将位置更改为绝对位置？提前致谢！
编辑：如果将左侧更改为 100%，将顶部更改为 10%，您会发现它们的高度不同。它们在 FF for Mac 中似乎是相同的高度。
I have two inline elements. You may assume they are exactly the same, except the position of one is set to absolute and it's positioned below the other. Like this:
<body style="text-align: center;">
<span style="background-color: #000; color: white; font-size: 300px; line-height: 1; padding: 0; position: relative;">
AAA <span style="background-color: #333; color: white; font-size: 300px; line-height: 1; padding: 0; position: absolute; top: 100%; left: 0;">AAA</span>
</span>
</body>
Fiddle: http://jsfiddle.net/CSPFL/5/
And, of course, the full screen fiddle: http://jsfiddle.net/CSPFL/5/show/
The spans aren't the same height! The static span has padding of some kind. Is it possible to remove this padding, without changing the position to absolute? Thanks in advance!
EDIT: you can see they aren't the same height if you change left to 100% and top to 10%. They seem to be the same height in FF for Mac.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
该问题可以根据
位置：绝对来隔离。只需将其添加到具有line-height: 1的span规则中即可更改其外观。这取决于不同类型元素的不同高度计算算法（CSS 棘手的一面的一部分）。由于您的问题是非定位的
span太高，因此在渲染中将其转换为块元素（或内联块）可能会有所帮助：添加或
为
span>。The issue can be isolated as depending on
position: absolute. Just adding it to the rules for aspanthat hasline-height: 1changes its appearance. This depends on different height calculation algorithms for different kinds of elements (part of the tricky side of CSS).Since your problem is that the non-positioned
spanis too tall, it might help to turn it to a block element (or inline block) in rendering: addor
for the
span.试试这个：
http://jsfiddle.net/CSPFL/1/
try this :
http://jsfiddle.net/CSPFL/1/