2

我有一个包含一些垂直文本的 HTML 页面。一切都很好,直到我在 IE11 中查看它 - 然后垂直文本不再是垂直的。“该死,我不应该搞砸设计师的原版,在 IE 中渲染还可以”我想。但事实证明,设计师的原始渲染在他们的服务器上正常,但在需要托管的服务器上却不行。我已将问题归结为以下几点:

    #vertical_text {
    
    	white-space: pre;
    	display: block;
    	height: 100%;
    	width: 100%;
        color:blue;
    	-webkit-transform: rotate(90deg);   
    	-moz-transform: rotate(90deg);
    	-ms-transform: rotate(90deg);
    	-o-transform: rotate(90deg);
    	transform: rotate(90deg);
}
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en">
    
    <head>
    <meta charset="windows-1252" />
    
    </head>
    
    <body>
    <table><tr><td>ABC</td><td><div id="vertical_text">DEF</div></td></tr></table>
    </body>

这在 FF、Chrome、Edge 以及当我在 IE 中将其加载为 file:/// 时效果很好。但是当我使用 IE 从我们的 IIS 服务器或 Apache 服务器查看它时,垂直文本不再是垂直的。设计者的服务器是基于 LINUX 的,我们是一个 Windows 站点,这表明存在编码问题,但如果是,我会不知道该怎么办。我尝试在 windows-1252 和 utf-8 之间更改字符集元标记,但没有区别。我已经尝试了此处给出的 IE 中垂直文本的各种替代方案

如何使用 CSS 跨浏览器绘制垂直文本?

但它们都不起作用。有任何想法吗?

4

0 回答 0