ie8下面margin:0 auto;不能居中的解决方案,ie8兼容性代码

  今天写了个div,用margin:0 auto;来定义他的属性,让他居中,结果,竟然无效。
  一开始以为是css里的代码冲突了,检查了好几遍,没问题,然后用火狐和谷歌浏览器测试,居中了。。。
  看来是浏览器兼容性的问题,突然想起现在用了win7,ie已经升级到了ie8,看来问题就处在ie8的兼容性上。百度之。。。。

  特将解决方法复制到下面:
  IE6,7,Firefox下实现居中一般用:margin: auto 来实现,但在IE8下,这是不够的。现提供两种解决的办法:

  方法一(推荐):

  首先页首必须设置文档类型:
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transition al.dtd">

  且在head内添加:
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/> 即可!

  方法二:

  body设置 {text-align:center;width:100%;}
  将所有div全部包括在<div id="wrap">中,wrap如下设置:
  #wrap    { text-align:left; width:***;  margin:0 auto;  }

  且在head内添加:
  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>

  即可!

  方法三:

  用<center></center>取代二中的wrap层。

IE8 margin:0 auto 不能居中显示的问题的更多相关文章

  1. 绝对定位后,position:absolute;不能使用margin: 0 auto;实现居中;

    声明: web小白的笔记,欢迎大神指点!联系QQ:1522025433. 我们都知道margin: 0 auto:可也实现块状元素的水平居中:但是对于绝对顶为的元素就会失效: 请看实例: <!d ...

  2. margin:0 auto;不居中

    margin:0 auto:不居中可能有以下两个的原因; 1.没有设置宽度<div style="margin:0 auto;"></div>看看上面的代码 ...

  3. CSS样式margin:0 auto不居中

    <style type="text/css">html,body{height:100%;width:960px;}.container{background-colo ...

  4. margin:0 auto;不能居中的原因

    原因: 1.没有设置本身元素和父元素的宽度 2.本身元素使用了绝对定位和浮动 2.没声明DOCTYPE

  5. postion:fixed和margin:0 auto的使用

    很多同学将顶部菜单固定,使用postion:fixed,然后使用margin:0 auto进行居中,发现margin:0 auto并不起作用. 通常,我们要让某元素居中,会这样做: #element{ ...

  6. IE下margin:0 auto为什么不居中?

    http://blog.sina.com.cn/s/blog_68c6be330101k7kn.html 我们经常用DIV+CSS布局网页的时候,正常情况下需要将div居中显示时,使用Css样式:ma ...

  7. 图片margin:0 auto;为何不居中

    图片margin:0 auto;为何不居中 关键: img元素 display设为block 代码: <!DOCTYPE html> <html> <head> & ...

  8. 正确的使用margin:0 auto与body{text-align:center;}实现元素居中(转)

    body{text-align:center}与margin:0 auto的异同? text-align是用于设置或对象中文本的对齐方式.一般情况下我们设置文本对齐方式的时候需要用此属性进行设置 我们 ...

  9. margin:0 auto为何会居中?

    margin: 0 auto;为何会居中呢??? 一开始的学习html的时候,就是只知道块级元素margin:0 auto就能居中 但是后来就很好奇 margin: auto 0;为何不能垂直居中? ...

随机推荐

  1. shiroWeb项目-登陆与退出实现(九)

    原理 使用FormAuthenticationFilter过虑器实现 ,原理如下: 将用户没有认证时,请求loginurl进行认证,用户身份和用户密码提交数据到loginurl FormAuthent ...

  2. Linux内存管理4---虚拟地址空间管理

    1.前言 本文所述关于内存管理的系列文章主要是对陈莉君老师所讲述的内存管理知识讲座的整理. 本讲座主要分三个主题展开对内存管理进行讲解:内存管理的硬件基础.虚拟地址空间的管理.物理地址空间的管理. 本 ...

  3. Linux MMC framework2:基本组件之host

    声明:本文很多内容和思路参考了http://www.wowotech.net/comm/mmc_host_driver.html,对原作者表示感谢! 1.前言 本文是Linux MMC framewo ...

  4. openstack新版本ocata的接口改动

    新增placement API,部分替代了原先的nova api的部分功能接口 可在此页面查看API详情及示例:https://specs.openstack.org/openstack/nova-s ...

  5. 通过本地yum源安装软件报错[Errno 14] PYCURL ERROR 56 - "Failure when receiving data from the peer"

    通过本地yum源安装软件报错 http://192.168.3.85/centos/6/os/x86_64/Packages/php-pdo-5.3.3-47.el6.x86_64.rpm: [Err ...

  6. 修改centos和ubuntu ssh远程连接端口提升系统安全性

    #修改centos服务器ssh端口 sed -i 's/#Port 22/Port 38390/' /etc/ssh/sshd_config sed -i 's/^GSSAPIAuthenticati ...

  7. python装饰器@用法

    这个是我见过比较好的讲解链接: [廖雪峰的官方网站 - 装饰器]

  8. Golang依赖管理工具:glide从入门到精通使用

    这是一个创建于 2017-07-22 05:33:09 的文章,其中的信息可能已经有所发展或是发生改变. 介绍 不论是开发Java还是你正在学习的Golang,都会遇到依赖管理问题.Java有牛逼轰轰 ...

  9. Clipboard深度实践与采坑记录

    1.css禁止选择导致IOS无法复制 body{ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: ...

  10. python与redis

    1.什么是redis Redis 是一个key-value存储系统.和Memcached类似,它支持存储的value类型相对更多,包括string(字符串).list(链表).set(集合).zset ...