10

我在我正在制作的网站上对齐 IE8 中的日文字符时遇到了一些问题。

我有类似的东西<span>Label</span><span>Some value</span>。当“Label”和“Some value”都是日文或英文时，它们可以很好地对齐，但是当它们混合时（“Label”总是日文，但“Some value”可能不是），那么对齐就会关闭。下图中的示例：

在此处输入图像描述

惊喜，惊喜，它在其他浏览器中都可以正常工作，例如来自 Chrome 的相同图像：

Chrome 中的示例

我不知道如何解决这个问题。有没有人遇到过这种情况或知道解决方法？我的公司仍然主要使用 IE7，所以一些适用的技巧将是最有用的。

编辑 1：我忘了添加我现在使用的 css。对于我拥有的标签：

display: inline-block;
color: Gray;
vertical-align: text-top;

/*For IE7*/
zoom: 1;
*display: inline;

对于我使用类似的值：

display: inline-block;
margin: 0x 0px 0px 0px;
padding: 0px 0px 0px 0px;
vertical-align: text-top;

/*For IE7*/
zoom: 1;
*display: inline;

编辑2：我确定这与这个问题有关。我的表单中有输入框，它们完全对齐，直到我输入一些日文字符。罗马字符再次没有问题。见下文：

在此处输入图像描述

同样，在其他浏览器中没有任何问题......

编辑 3：

今天又看了一遍（我问了这个问题一年多之后......）。在IE9中，字符的显示和Chrome等浏览器一样，基本上罗马字和日文字都排好。我使用 IETester 进行了检查，对于同一页面，日文字体在 IE8 中比 IE9 对齐“更高”。

在 IE8 中：

在 IE8 中

在 IE9 中：

在 IE9 中

我当时没有去检查这个，因为我没有 IE9。字体看起来相同，所以它一定是一个 IE 问题，我猜对此无能为力吗？

4

4 回答 4

1

确保您还vertical-align为文本框分配了一个。

http://jsfiddle.net/HkrJH/

至于跨度的麻烦，我无法重现。你用的是什么字体？你能发布一个演示这个问题的jsfiddle吗？

于 2012-04-03T17:02:16.940 回答
0

您可以在网页的 HEAD 元素中放置以下 HTML 标记：

<meta http-equiv=“X-UA-Compatible” content=“IE=7” />
于 2012-04-03T16:27:31.393 回答
0

我相信这可能是用于日文和英文的默认字体的问题。英文字符比日文包含更多的空格，因为英文必须容纳像“c”（正方形）、“t”（更高）和“g”（更深）这样的字符，而所有字符在日文中都是方格。因此，如果您使用相同像素大小的字符，英文字符仍然可以与日文字符不同，具体取决于用于两种语言的字体（可能不一样，或者即使相同也不会对齐）。如果你使用vertical-align: middle; 你应该得到更好的结果。

于 2012-04-06T13:44:11.150 回答
0

互联网浏览器太可怕了。

定位您的浏览器并添加样式表。

头部示例：

<!--[if IE 6]><link rel="stylesheet" href="http://mysite.com/path/to/ie6.css" type="text/css" media="screen, projection"><![endif]-->

<!--[if IE 7]><link rel="stylesheet" href="http://mysite.com/path/to/ie7.css" type="text/css" media="screen, projection"><![endif]-->
于 2011-08-29T00:26:40.490 回答