Question

我有一个外部div，它在chrome，firefox中正常工作但不在IE中..我在外部div中有一些内容..使它居中对齐或页面中间我给出了这个宽度：970px;高度：630像素;到外部div ...所以我得到了chrome和Mozilla中心的内容......但是在IE 7的情况下...在IE中左边对齐..

这是我的css ....

<style type="text/css">
body, html 
{ 
    font-family:helvetica,arial,sans-serif; 
    font-size:90%; 
}
div.outer 
{  
    display: block; 
    margin-left: auto;
    margin-right: auto;
    width:970px;
    height:630px;
    position:relative;
}
</style>

这是我的完整代码：

<head><title>home</title>
</head><body class='claro'><div class='outer' style="border:1px solid black;">
<div id="dottedBorderhome">
</div>
<div id="dragIconhome">
</div>
<div class="claro" id="menuDiv2" onclick="setWidgetproperty(this.id,'x','navMenu2');" onmousedown="setMenuBarProperty('navMenu2');" onmouseup="setDocStyle(this.id)" style="border: 1px dotted white; left: auto; position: absolute; top: 17px;">
     <!-- here one menu bar will come -->
</div>
<div class="claro" id="divlabel43" onclick="setWidgetproperty(this.id,null,'divlabel43')" onmouseup="setDocStyle(this.id)" style="left: 50px; position: absolute; top: 92px; text-align: right; font-family: Times; font-size: 15pt; font-weight: bold;" >
     <label id="label43" onclick="setLblProperty(this.id)" onmouseover="editName('divlabel43',this.id,'label')">
          Worklist Manager
     </label>
</div>
<div class="claro" id="htmlTableDiv9" onmouseup="setDocStyle(this.id)" style="left: auto; position: absolute; top: 130px; height:70px; width:150px;">
     <!-- here its contains table -->
</div>
<div class="claro" id="divImage2" onclick="setWidgetproperty(this.id,'xy','image2')" onmouseup="setDocStyle(this.id)" style="left: auto; position: absolute; top: 70px;">
     <img class="images" id="image2" name="Search-icon2.png" onclick="setImgProperty(this.id)" src="images/uploads/Search-icon2.png" style="height: 50px; width: 58px;">
</div>

<div class="claro" id="menuDiv1" onclick="setWidgetproperty(this.id,'x','navMenu1');" onmousedown="setMenuBarProperty('navMenu1');" onmouseup="setDocStyle(this.id)" style="border:1px dotted white; left: auto; position: absolute; top: 640px;">
     <!-- here another menu bar -->
</div>

<div id="CWPWORKLIST__1" onclick="setWidgetproperty(this.id,'xy','inner__CWPWORKLIST__1')" ondblclick="editDataGridResponseMapping(this.id)" onmouseup="setDocStyle(this.id)" style="left:auto; position:absolute; top:340px; height: 296px; width: 921px;">
     <!-- here another table-->
</div>
</div></body>

Answer 1

正如斯文所说，https://stackoverflow.com/questions/4742877/center-align-div-in-internet-explorer可能会得到答案。要么你有无效的HTML将IE7置于怪癖模式，要么你错过了doctype。

Answer 2

试试这个

<style type="text/css">
body, html 
{ 
    font-family:helvetica,arial,sans-serif; 
    font-size:90%; 
}
div.outer 
{  
    display: block; 
    margin:0 auto;
    width:970px;
    height:630px;
    position:relative;
}
</style>

Answer 3

使用具有适当文档类型的代码。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

我的内容在IE 7中保持对齐？

3 个答案: