margin:0 auto 在IE下失效,firefox下都是正常显示的,IE不能居中
<link rel="stylesheet" type="text/css" href="/Admin/Public/Css/style.css">
<link rel="stylesheet" type="text/css" href="/Admin/Public/Css/menu.css">
<head>
<!-- A public loading -->
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js” type=”text/javascript/></script>
<script>! window.jQuery && document.write('<script src="/Public/Js/jquery-1.7.2.min.js"><\/script>');</script>
<!-- A public loading end -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/Public/Js/pngobject.js"></script>
<script type="text/javascript" src="/Public/Js/swfobject.js"></script>
<title>www.ctobchina</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<div class="con_center">
<div class="title_top"><img src="/Admin/Public/Img/top.png"></div>
<div style="clear:both;"></div>
<div class="nav"><div id="bo">
<div><img src="/Admin/Public/Img/img/nav_top.png"></div>
<ul id="menu">
<li class="L1"><a href="javascript:c(m01);" id="m01"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/> 我的办公桌</span></a></li>
<ul id="m01d" style="display:none;" class="U1">
<li class="L21"><a href="javascript:c(f40);" id="f40"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/> 电子邮件</span></a></li>
<ul id="f40d" style="display:none;">
<li class="L3"><a href="javascript:a('email','1');" id="f1"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/>内部邮件</span></a></li>
<li class="L3"><a href="javascript:a('webmail','2');" id="f2"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/>Internet 邮件</span></a></li>
</ul>
<li class="L21"><a href="javascript:c(f41);" id="f41"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/> 短信息</span></a></li>
<ul id="f41d" style="display:none;">
<li class="L3"><a href="javascript:a('sms','3');" id="f3"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/>内部短信</span></a></li>
<li class="L3"><a href="javascript:a('mobile_sms','42');" id="f42"><span><img src="/Admin/Public/Img/ico/2.gif" align="absMiddle"/>手机短信</span></a></li>
</ul>
</ul>
</div>
<div class="img_bottom"><img src="/Admin/Public/Img/img/menu_bottom_bg.png"></div>
</div>
<div class="con"><iframe src="#" name="i1" width="900" height="600" scrolling="no" frameborder="0" ></iframe></div>
</div>
<div id="bottom"></div>
<script language="JavaScript">
var cur_id="";
var flag=0,sflag=0;
//-------- 菜单点击事件 -------
function c(srcelement)
{
var targetid,srcelement,targetelement;
var strbuf;
//-------- 如果点击了展开或收缩按钮---------
targetid=srcelement.id+"d";
targetelement=document.getElementById(targetid);
if (targetelement.style.display=="none")
{
srcelement.className="active";
targetelement.style.display='';
menu_flag=0;
expand_text.innerHTML="收缩";
}
else
{
srcelement.className="";
targetelement.style.display="none";
menu_flag=1;
expand_text.innerHTML="展开";
var links=document.getElementsByTagName("A");
for (i=0; i<links.length; i++)
{
srcelement=links[i];
if(srcelement.parentNode.className.toUpperCase()=="L1" && srcelement.className=="active" && srcelement.id.substr(0,1)=="m")
{
menu_flag=0;
expand_text.innerHTML="收缩";
break;
}
}
}
}
function set_current(id)
{
cur_link=document.getElementById("f"+cur_id)
if(cur_link)
cur_link.className="";
cur_link=document.getElementById("f"+id);
if(cur_link)
cur_link.className="active";
cur_id=id;
}
//-------- 打开网址 -------
function a(URL,id)
{
set_current(id);
if(URL.substr(0,7)!="http://" && URL.substr(0,6)!="ftp://")
URL = "/general/"+URL;
parent.openURL(URL,0);
}
function b(URL,id)
{
set_current(id);
URL = "/app/"+URL;
parent.openURL(URL,0);
}
//add by YZQ 2008-03-05 begin
function bindFunc() {
var args = [];
for (var i = 0, cnt = arguments.length; i < cnt; i++) {
args[i] = arguments[i];
}
var __method = args.shift();
var object = args.shift();
return (
function(){
var argsInner = [];
for (var i = 0, cnt = arguments.length; i < cnt; i++) {
argsInner[i] = arguments[i];
}
return __method.apply(object, args.concat(argsInner));
});
}
var timerId = null;
var firstTime = true;
//add by YZQ 2008-03-05 end
function d(URL,id)
{
//add by YZQ 2008-03-05 begin
var winMgr = parent.parent.table_index.main.winManager;
if (!winMgr) {
if (firstTime) {
parent.openURL("/fis/common/frame.jsp",0);
firstTime = false;
}
timerId = setTimeout(bindFunc(d, window, URL, id), 100);
return;
}
firstTime = true;
if (timerId) {
clearTimeout(timerId);
}
if (winMgr) {
winMgr.openActionPort("/fis/"+URL, document.getElementById("f" + id).innerText);
return;
}
//add by YZQ 2008-03-05 end
set_current(id);
URL = "/fis/"+URL;
parent.openURL(URL,0);
}
//-------- 菜单全部展开/收缩 -------
var menu_flag=1;
function menu_expand()
{
if(menu_flag==1)
expand_text.innerHTML="收缩";
else
expand_text.innerHTML="展开";
menu_flag=1-menu_flag;
var links=document.getElementsByTagName("A");
for (i=0; i<links.length; i++)
{
srcelement=links[i];
if(srcelement.parentNode.className.toUpperCase()=="L1" || srcelement.parentNode.className.toUpperCase()=="L21")
{
targetelement=document.getElementById(srcelement.id+"d");
if(menu_flag==0)
{
targetelement.style.display='';
srcelement.className="active";
}
else
{
targetelement.style.display="none";
srcelement.className="";
}
}
}
}
//-------- 打开windows程序 -------
function winexe(NAME,PROG)
{
URL="/general/winexe?PROG="+PROG+"&NAME="+NAME;
window.open(URL,"winexe","height=100,width=350,status=0,toolbar=no,menubar=no,location=no,scrollbars=yes,top=0,left=0,resizable=no");
}
</script>
</body>
</html>
以下是css:
.con_center{height:300px;width:1200px;margin:0px auto;padding-top:20px; }
#bo{float:left; width:180px;}
.con{float:left;width:900px; height:600px; background:url(../Img/pro1_bg1.png); margin-left:20px;display;margin-top:10px;}
.img_bottom{width:180px; height:80px;padding-left:4px; clear:left;}
.img_top{width:180px; margin-bottom:-5px;}
.nav{float:left;}
.title_top{margin:20px 0 -5px 40px;}
[解决办法]
http://hi.baidu.com/lh1985/blog/item/24a4cb02ca406e024afb5135.html
[解决办法]
试试加个text-align:center;
[解决办法]
编码要一致
[解决办法]
使用文档头
[解决办法]
给body加个{margin:0px auto;}
[解决办法]
别管ie6啦,过时了
[解决办法]
第一行必须保证是dtd声明,否则ie6会进入怪癖模式
[解决办法]
第一行必须添加dtd声明,没有dtd的结果就是ie6,7,8,9以ie5的方式来渲染页面,就是ie7,8,9里边的f12打开后 文档模式下的quirks模式。这个模式会造成css盒模型计算错误,margin:0 auto; 不能居中。
只能在body{text-align:center;}这样来居中,但是这会使页面上所有的内容都居中,所以请添加dtd
dtd必须是页面的第一行出现。
xhtml-dtd:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
html5-dtd:
<!DOCTYPE html>
[解决办法]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
text-align:center;
加上这两个试试,兼容
[解决办法]
body{margin:0 auto;width:980px;}
[解决办法]
同意添加DTD
[解决办法]
要加宽度,否则无用
[解决办法]
10楼,12楼正确。
[解决办法]
body{
text-align:center;
}
需要居中的容器:text-align:left;