Home > Web Front-end > HTML Tutorial > IE下面网页居中显示的问题_html/css_WEB-ITnose

IE下面网页居中显示的问题_html/css_WEB-ITnose

WBOY
Release: 2016-06-21 09:42:11
Original
1195 people have browsed it

ie 居中

页面在Chrome和FF下是居中的,但在IE各个版本下面都是靠左显示的,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
Copy after login

.center{margin:0px auto;}
Copy after login

这两个都加上了,请问各位大侠还有什么需要注意的地方?


回复讨论(解决方案)

body, html{width:100%;height:100%;}
.center{margin:0px auto;}

body, html{width:100%;height:100%;}
.center{margin:0px auto;}
加上了第一句了,还是不行啊!

相关CSS文件如下:

/*---------- base ---------*/
*{padding:0px;margin:0px;}
html{background:#FFF;}
body{font:12px Verdana,Arial,Tahoma; line-height: 1.8em; color:#999999;}
img{border:none;}

button {
border: 1px solid #CCCCCC;
padding: 5px;
cursor:pointer;
}
a{color:#666666;text-decoration:none;}
a:hover{ background-color:#8D900B; color:#ffffff}
.header a:hover,.pagelist a:hover,.favorite a:hover,.pic a:hover,a.pic:hover{ color:#8D900B; background-color:#ffffff}
ul,li{list-style:none;}
input,select,button{font:12px Verdana,Arial,Tahoma;vertical-align:middle;}
h1, h2, h3, h4, h5, h6 {font-family: "Microsoft YaHei";font-size: 100%;font-weight: normal;}
/*---------- stock ---------*/
.center{margin:0px auto;}
.w960{width:960px;}
.wrapbox {margin: 0 auto;width: 960px;clear:both;}
.mainbox{ width:630px; float:left; overflow:hidden}
.sidebox{ width:300px; float:right; overflow:hidden}
.fl{ float:left}
.fr{ float:right}
.mt1{margin-top:8px;}
.mt2{margin-top:16px;}
.clear{overflow:hidden; clear:both; height:1px; line-height:1px;}
.fs-12{font-size:12px;}
.fc-f60{color:#F60;}
.fc-f90{color:#F90;}
.clr{clear:both;}
.ipt-txt{line-height:15px;padding:4px 5px;border-width:1px;border-style:solid;border-color:#ccc;font-size:12px;margin-right:2px;}
.nb{line-height:20x;padding:1px 2px;border-width:1px;border-style:solid;border-color:#666 #BBB #BBB #666;font-size:12px;margin-right:2px}
.btn-1{padding: 0px;width:56px;height:24px;border:none;background:url(../images/comm-bt.gif) no-repeat;line-height:25px;letter-spacing:1px;cursor:pointer;overflow:hidden;color:#585858;}
.btn-2{width:70px;height:25px;border:none;background:url(../images/btn-bg2.gif) left top no-repeat;line-height:25px;overflow:hidden;color:#444;margin-right:2px;cursor:pointer;}
.header{width:100%;overflow:hidden; margin-bottom: 10px;}
.header_top{background: url("../images/topbar.png") repeat-x scroll 0 -8px transparent;clear: both;height: 28px;line-height:26px;}
.header_top .welcome{float:left;padding-left:10px;height:26px;line-height:26px; }
.header_top a.rss{}
.header_top .toplinks{ float:right;height:26px;line-height:26px;}
.header_top .toplinks a{margin:0 2px;}
.header_top .toplinks span{margin-left:15px;}
.header .top{ /**background:url("../images/line.gif") repeat-x scroll left bottom transparent;**/ border-bottom:1px solid #FAEFE3; height:96px;position: relative;overflow: hidden;}
.logo {height: 85px;width:345px;position:absolute;left:0;top:0}
.logo h1 a {background: url("../images/logo.gif") no-repeat scroll 0 0 transparent;display: block;height: 85px;overflow: hidden;text-indent: -9999em;width: 345px;}
.hi{ float:left}
.userface{ float:right; margin-top:5px;}
.userface img{ border:1px solid #dddddd; padding:1px;}
.userface a:hover{ background:none;}
.userface a:hover img{ border:1px solid #8D900B}
.mylink{ float:left}
.mylink li{ float:left}

把你的HTML的完整代码贴上来呀

要不然你试试这个:
body{ text-align:center; }
.center{ margin:0 auto; text-align:left; }

要不然你试试这个:
body{ text-align:center; }
.center{ margin:0 auto; text-align:left; }
这个倒是居中了,但所有文本也居中了

再为不需要居中的设置text-align:left;不就行了?

很多标签啊,都要设岂不是太麻烦了?

很多标签啊,都要设岂不是太麻烦了?
你把完整的HTML代码贴出来呀,你之前贴的不完整

引用 8 楼 crazyzyc 的回复:很多标签啊,都要设岂不是太麻烦了?
你把完整的HTML代码贴出来呀,你之前贴的不完整

这个是Header.html的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><?=$headtitle?>
Copy after login

哦,你这个代码里找不到.center啊,
估计应该是由JS或PHP动态生成的。
你能把动态生成的代码贴上来吗?(可以通过浏览器的开发者工具得到动态生成的HTML)

刚看了下,浏览器的浏览源文件里也没有.center,我把.center改成 body,还是不行,应该改哪里啊?

你到底要哪部分居中?至少哪个要居中的DIV,要设置width比如996px,然后加margin:0 auto;要不全部都默认width 100%,当然不会居中罗。

相对文件必须要有个宽度

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template