展会信息港展会大全

div层火狐居中在ie不居中
来源:互联网   发布日期:2016-03-25 15:53:29   浏览:2497次  

导读:本文章来总结关于div层火狐居中在ie不居中,在IE6/7/8中用margin:0 auto;无法实现居中的解决办法。一般的我们所说的居中有两种,层的居中和层内的居中,层的居中我一般都用:m...

本文章来总结关于div层火狐居中在ie不居中,在IE6/7/8中用margin:0 auto;无法实现居中的解决办法。

一般的我们所说的居中有两种,层的居中和层内的居中,层的居中我一般都用:margin:0 auto;(或者 margin-left: auto;margin-right: auto;) 这样的写法;层内的居中(我一般都用于层内的文字):text-align:center;

这段代码在FF中可以居中,而在IE6/7/8中均不能居中。换成:MARGIN-RIGHT: auto; MARGIN-LEFT: auto;也一样,而且,居右margin:0pt 0pt 0pt auto;的也失效了

问题并不在CSS而在XHTML网页本身

需要加上这样的代码才能使得上述设置有效果:

代码如下

复制代码

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

如果没有这句话,在IE6/7/8中只用margin:0 auto;是无法实现居中的,而在FF中却可以。

如果加了doctype声明,则在一个body下的div,只用margin:0 auto;即可在IE和FF中都实现居中。

DIV在整个body中水平居中:

代码如下

复制代码

#DivComment{

position:absolute;

top: 90%;

left: 45%;

width:40%;

margin:0 0 0 -240px;

padding: 10px 10px 0px 0px;

}

实例

DIV在另一个DIV中水平居中:

代码如下

复制代码

#div1{

TEXT-ALIGN: center;

}

#div2{

MARGIN-RIGHT: auto;

MARGIN-LEFT: auto;

height:200px;

background:#F00;

width:400px;

}

在要居中的div的父级元素(未必是div,可以是ul、li等)中设置TEXT-ALIGN: center;即可实现此div居中,但仅限于IE6&IE7。在此div中加上MARGIN-RIGHT: auto; MARGIN-LEFT: auto;或者margin: 0 auto;即可实现在firefox中也居中

赞助本站

人工智能实验室

相关热词: 开发 编程 android

AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港