仅在一台机器上出现 HTML 对齐问题(均为 IE8)
Posted
技术标签:
【中文标题】仅在一台机器上出现 HTML 对齐问题(均为 IE8)【英文标题】:HTML Alignment Issue in one machine only (both IE8) 【发布时间】:2012-04-14 04:09:24 【问题描述】:我有以下 html 和 CSS 代码。它在一台机器上的 IE8 中运行良好;但在第二台机器上与 IE8 不一致。为了纠正它需要改变什么?
注意:未对齐是针对“注销”文本。
注意:图片尺寸为 214 X 57
注意:两个系统具有相同的分辨率和 100% 缩放。
<!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">
<head id="Head1">
<title>Helpdsk Services Admins Site </title>
<link href="Styles/MasterStyle.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="wrapper">
<div id="container">
<div class="clear">
<div id="header">
<div id="logo">
<img src="Images/Logo.png" />
</div>
<div id="titleInfo">
<a>Helpdsk Services Admins Site</a>
<div id="signOut">
<a id="LoginStatus1">Logout</a>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
MasterStyle.css
body
margin: 0px; padding: 0px; text-align: center; background: Orange;
#wrapper
width: 100%; height: auto; text-align:left; margin: 0 auto; background: Orange;
#container
width: 850px; height: auto; margin: 0 auto; background: white;
#header
width: 850px; height: 70px; background: white; padding: 0 0 10px 0;
#titleInfo
font:bold 18pt Arial; color:#2377D1; width:590px; height:35px; float:left; margin:10px 0 0 10px;
border-bottom:3px solid #fcda55; padding: 10px 0 0 0; display:inline;
#signOut
font:bold 9pt Arial;float:right;border-bottom:none;padding: 0px 10px 0 0;display:inline;
#logo
width:200px; height:60px; float:left; margin:0 0 0 20px; display:inline; padding: 10px 0 0 0;
.clear
clear: both;
阅读:
-
Align contents inside a div
【问题讨论】:
【参考方案1】:尝试将此元标记添加到您的头部:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
这应该会阻止 IE 中的兼容模式并强制使用标准模式。
【讨论】:
有什么解决方案可以让它在 IE7 中运行(我还没有在 IE7 中测试过)? IE7 可以使用 添加元标记有效。谢谢。这是一条很好的信息。但是,@Wolf-Kun 的回答更适合我的简单案例。【参考方案2】:IE有一个Compatibility View按钮,检查是否都勾选了。此按钮更改 IE 兼容版本。
You can set differents css for differents versions:
<link rel="stylesheet" type="text/css" href="css/chooser.css" />
<!--[if IE]> <link rel="stylesheet" type="text/css" href="css/chooser_ie.css" /> <![endif]-->
<!--[if IE 6]> <link rel="stylesheet" type="text/css" href="css/chooser_IE6.css" /> <![endif]-->
【讨论】:
我需要让它适用于所有设置。有多个用户使用自己的配置访问 websie。还有其他想法吗? @Lijo 当 IE8 处于“兼容”模式时,它基本上是在模仿 IE7。您的页面在 IE7 中可以运行吗? 它在不同机器上的 IE6 中工作。我正在寻找一种适用于所有版本> 1E6 的所有配置的解决方案。这应该是可能的,因为这是一个基本的对齐问题。 @Lijo,您可以根据IE版本配置您的CSS并测试兼容性检查或未检查 您能告诉我需要什么更改才能使其适用于 IE7 吗?【参考方案3】:只是改变
<a>Helpdsk Services Admins Site</a>
到
<a style="float:left;" >Helpdsk Services Admins Site</a>
无论如何都对我有用(我以前遇到过这个问题),一种方式是 ie 显示错位,另一种方式,它没有:
附言。如果你一直喜欢上课,那就为你制作一个 标签。
【讨论】:
你能回答***.com/questions/9978592/…吗?【参考方案4】:试着把它放在下面<div id="logo">
<div id="signOut">
<a id="LoginStatus1">Logout</a>
</div>
【讨论】:
【参考方案5】:大多数时候我看到这个,用户稍微放大(或缩小,但通常是)导致事情稍微歪斜。
【讨论】:
两个系统具有相同的分辨率和 100% 缩放。我们如何克服这一点?以上是关于仅在一台机器上出现 HTML 对齐问题(均为 IE8)的主要内容,如果未能解决你的问题,请参考以下文章
在一台机器上出现 DacServices 错误,而不是在另一台机器上