首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

margin:零 auto 在IE下失效,firefox下都是正常显示的,IE不能居中

2013-11-20 
margin:0 auto 在IE下失效,firefox下都是正常显示的,IE不能居中link relstylesheet typetext/css h

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;

热点排行