为什么相同的角色在不同的浏览器中占用不同的空间？

-1

为什么在Chrome和FF上绿色背景的角色需要更多空间？在Internet Explorer上采取同样的空间（高度）为什么相同的角色在不同的浏览器中占用不同的空间？

所有字符我做了一个小提琴 https://jsfiddle.net/xuqa3a0f/

<div style="background: yellow; float: left">↕</div> 
 
    <div style="background: Chartreuse; float: left">▴</div> 
 
    <div style="background: yellow; float: left">A</div> 
 
    <div style="background: yellow; float: left">B</div> 
 
    <div style="background: yellow; float: left">C</div> 
 
    <div style="background: yellow; float: left">1</div> 
 
    <div style="background: yellow; float: left">2</div> 
 
    <div style="background: yellow; float: left">3</div> 
 
    <div style="background: yellow; float: left">↔</div> 
 
    <div style="background: Chartreuse; float: left">↖</div>

THX的提前任何答案。

来源

2015-09-02 IJotDe

HTML中的特殊字符可以使用不同的字体，并且这些字体可以有不同的行高。

它在这里很大篇幅谈到：http://www.cs.tut.fi/~jkorpela/html/characters.html

但要解决它，你必须使用一个公共线的高度。

如果我在你的榜样使用下面的CSS它看起来不错：

.cell { 
    display: table-cell; 
    background: chartreuse; 
    line-height: 25px; 
}

所以我会说这是不是一个错误，但是浏览器不同的方式解释字符。

来源

2015-09-02 12:56:40 Upperface

Thx为您的答案。它没有解决我的问题。我有一个表结构，需要这个结构。它看起来像这样：https://jsfiddle.net/vepm87Ly/ 我需要每一行的高度相等，但由于特殊字符的空间消耗，第一行更高。如果可能，我不想使用像素高度。 – IJotDe

我确实改变了我的答案，因为我找到了一些新的信息。我不认为没有使用line-height来解决它的解决方案。如果你不想使用像素高度，你也可以用em或pt来设置你的行高，例如：line-height：1.5pt; – Upperface

Thx为您的答案和解释。 – IJotDe

为什么相同的角色在不同的浏览器中占用不同的空间？

回答

相关问题