嘿伙计们,我正试图让我的容器div在IE9中居中并且它不起作用,我尝试查找解决方案但找不到任何解决方案。这是网站的link(网站地图页面),这是我网站的网站地图页面的html:
<html>
<head>
<title>sitemap</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- Save for Web Styles (sitemap.psd) -->
<link href="sitemap.css" rel="stylesheet" type="text/css">
<!-- End Save for Web Styles -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>
<body style="background-color:#1c344c; margin-top: 0px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px;" onLoad="MM_preloadImages('images/template_69.gif','images/template_79.gif','images/template_89.gif','images/template_99.gif','images/template_112.gif','images/template_122.gif')">
<!-- Save for Web Slices (sitemap.psd) -->
<div id="Table_01">
<div id="sitemap-01">
<img src="images/sitemap_01.gif" width="800" height="50" alt="">
</div>
<div id="sitemap-02">
<img src="images/sitemap_02.gif" width="49" height="750" alt="">
</div>
<div id="sitemap-03"> <a href="../index.html"><img src="images/sitemap_03.gif" width="701" height="150" alt=""></a>
</div>
<div id="sitemap-04">
<img src="images/sitemap_04.gif" width="50" height="659" alt="">
</div>
<div id="sitemap-05">
<img src="images/sitemap_05.gif" width="1" height="600" alt="">
</div>
<div id="sitemap-06"><a href="../index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image22','','images/template_69.gif',1)"><img src="images/sitemap_06.gif" width="114" height="35" id="Image22"></a></div>
<div id="sitemap-07"><a href="../plants/plants.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image221','','images/template_79.gif',1)"><img src="images/sitemap_07.gif" width="105" height="35" id="Image221"></a></div>
<div id="sitemap-08"><a href="../soils/soils.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image222','','images/template_89.gif',1)"><img src="images/sitemap_08.gif" width="90" height="35" id="Image222"></a></div>
<div id="sitemap-09"><a href="../supplies/supplies.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image223','','images/template_99.gif',1)"><img src="images/sitemap_09.gif" width="128" height="35" id="Image223"></a></div>
<div id="sitemap-10"><a href="../contact/contact.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image224','','images/template_112.gif',1)"><img src="images/sitemap_10.gif" width="121" height="35" id="Image224"></a></div>
<div id="sitemap-11"><a href="../feedback/feedback.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image225','','images/template_122.gif',1)"><img src="images/sitemap_11.gif" width="142" height="35" id="Image225"></a></div>
<div id="sitemap-12">
<img src="images/sitemap_12.gif" width="700" height="9" alt="">
</div>
<div id="sitemap-13">
<img src="images/sitemap_13.gif" width="269" height="164" alt="">
</div>
<div id="sitemap-14"><span style="font-size:19px; letter-spacing:4px;"><strong>Sitemap</strong></span></div>
<div id="sitemap-15">
<img src="images/sitemap_15.gif" width="229" height="164" alt="">
</div>
<div id="sitemap-16">
<img src="images/sitemap_16.gif" width="202" height="10" alt="">
</div>
<div id="sitemap-17">
<img src="images/sitemap_17.gif" width="24" height="117" alt="">
</div>
<div id="sitemap-18" class="textsmall">• <a href="../index.html">About</a><br>
• <a href="../plants/plants.html">Plants</a><br>
• <a href="../soils/soils.html">Soils</a> <br>
• <a href="../supplies/supplies.html">Supplies</a><br>
• <a href="../contact/contact.html">Contact</a><br>
• <a href="../feedback/feedback.html">Feedback<br>
</a></div>
<div id="sitemap-19">
<img src="images/sitemap_19.gif" width="19" height="117" alt="">
</div>
<div id="sitemap-20">
<img src="images/sitemap_20.gif" width="188" height="301" alt="">
</div>
<div id="sitemap-21">
<img src="images/sitemap_21.gif" width="365" height="274" alt="A garden in the Fall">
</div>
<div id="sitemap-22">
<img src="images/sitemap_22.gif" width="147" height="301" alt="">
</div>
<div id="sitemap-23">
<div align="center"><span style="font-size: 14px;">Created by Kelsey©</span></div>
</div>
<div id="sitemap-24"> <table width="100%" height="35" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="middle"><span style="font-size: 12px;">Calgary, Alberta, Canada</span></td>
</tr>
</table>
</div>
<div id="sitemap-25">
<img src="images/sitemap_25.gif" width="49" height="91" alt="">
</div>
<div id="sitemap-26">
<img src="images/sitemap_26.gif" width="701" height="50" alt="">
</div>
</div>
<!-- End Save for Web Slices -->
</body>
</html>
现在这是此页面的 CSS :
body {
background-color: #1c344c;
background-image: url(Images/bgcolorr.jpg);
color: #287d7d;
font-family: Verdana, Geneva, sans-serif;
font-size: 24px;
}
Welcomee {
font-weight: bold;
}
img {border : 0;}
img a {outline : none;}
#Table_01 tr td p {
font-family: Verdana, Geneva, sans-serif;
text-align: center;
}
a:hover {color: lightgreen;}
a {color: green;}
body {
background-color: #1c344c;
background-image: url(Images/bgcolorr.jpg);
color: #287D7D;
font-family: Verdana, Geneva, sans-serif;
font-size: 24px;
background-repeat: repeat-x;
}
Welcomee {
font-weight: bold;
}
#Table_01 tr td p {
font-family: Verdana, Geneva, sans-serif;
text-align: center;
}
.textsmall {
font-size: 14px;
}
.textsmall1 {
font-size: 13
];
font-size: 14px;
}
img {border: none; }
a img {border: 0px; }
#Table_01 {
position:relative;
width:800px;
height:800px;
margin-left:auto;
margin-right:auto;
}
#sitemap-01 {
position:absolute;
left:0px;
top:0px;
width:800px;
height:50px;
}
#sitemap-02 {
position:absolute;
left:0px;
top:50px;
width:49px;
height:750px;
}
#sitemap-03 {
position:absolute;
left:49px;
top:50px;
width:701px;
height:150px;
}
#sitemap-04 {
position:absolute;
left:750px;
top:50px;
width:50px;
height:659px;
}
#sitemap-05 {
position:absolute;
left:49px;
top:200px;
width:1px;
height:600px;
}
#sitemap-06 {
position:absolute;
left:50px;
top:200px;
width:114px;
height:35px;
}
#sitemap-07 {
position:absolute;
left:164px;
top:200px;
width:105px;
height:35px;
}
#sitemap-08 {
position:absolute;
left:269px;
top:200px;
width:90px;
height:35px;
}
#sitemap-09 {
position:absolute;
left:359px;
top:200px;
width:128px;
height:35px;
}
#sitemap-10 {
position:absolute;
left:487px;
top:200px;
width:121px;
height:35px;
}
#sitemap-11 {
position:absolute;
left:608px;
top:200px;
width:142px;
height:35px;
}
#sitemap-12 {
position:absolute;
left:50px;
top:235px;
width:700px;
height:9px;
background-image:url(images/sitemap_12.gif);
}
#sitemap-13 {
position:absolute;
left:50px;
top:244px;
width:269px;
height:164px;
}
#sitemap-14 {
position:absolute;
left:319px;
top:244px;
width:202px;
height:37px;
background-color:#f2f2f2;
}
#sitemap-15 {
position:absolute;
left:521px;
top:244px;
width:229px;
height:164px;
}
#sitemap-16 {
position:absolute;
left:319px;
top:281px;
width:202px;
height:10px;
background-image:url(images/sitemap_16.gif)
}
#sitemap-17 {
position:absolute;
left:319px;
top:291px;
width:24px;
height:117px;
}
#sitemap-18 {
position:absolute;
left:343px;
top:291px;
width:159px;
height:117px;
background-color:#f2f2f2;
}
#sitemap-19 {
position:absolute;
left:502px;
top:291px;
width:19px;
height:117px;
}
#sitemap-20 {
position:absolute;
left:50px;
top:408px;
width:188px;
height:301px;
}
#sitemap-21 {
position:absolute;
left:238px;
top:408px;
width:365px;
height:274px;
}
#sitemap-22 {
position:absolute;
left:603px;
top:408px;
width:147px;
height:301px;
}
#sitemap-23 {
position:absolute;
left:238px;
top:682px;
width:365px;
height:27px;
background-color:#f2f2f2;
}
#sitemap-24 {
position:absolute;
left:50px;
top:709px;
width:701px;
height:41px;
background-image: url(images/sitemap_24.gif);
}
#sitemap-25 {
position:absolute;
left:751px;
top:709px;
width:49px;
height:91px;
}
#sitemap-26 {
position:absolute;
left:50px;
top:750px;
width:701px;
height:50px;
}
谢谢你们!
答案 0 :(得分:1)
因为你没有在HTML上面提到过DOCTYPE。
IE无法找到文档类型,因此在“文档模式:怪癖”中加载了页面
如果您将文档模式更改为IE9页面看起来不错。
最好在HTML上添加DOCTYPE。
here you can read about doctype