CSS DIV 布局网页内容 在IE下不显示的原因
发布网友
发布时间：2022-04-20 04:56
共13个回答
热心网友
时间：2022-04-20 06:26
首先，要有一个概念：凡是 table 布局可以实现的，CSS 一定可以实现。CSS 可以实现的，table 未必能做到。
现在来几个例子：
一、单行内容的居中
只考虑单行是最简单的，无论是否给容器固定高度，只要给容器设置 line-height 和 height，并使两值相等，再加上 over-flow: hidden 就可以了
.middle-demo-1{
height: 4em;
line-height: 4em;
overflow: hidden;
}
优点：
1. 同时支持块级和内联极元素
2. 支持所有浏览器
缺点：
1. 只能显示一行
2. IE中不支持<img>等的居中
要注意的是：
1. 使用相对高度定义你的 height 和 line-height
2. 不想毁了你的布局的话，overflow: hidden 一定要
为什么？
二、多行内容居中，且容器高度可变
也很简单，给出一致的 padding-bottom 和 padding-top 就行
.middle-demo-2{
padding-top: 24px;
padding-bottom: 24px;
}
优点：
1. 同时支持块级和内联极元素
2. 支持非文本内容
3. 支持所有浏览器
缺点：
容器不能固定高度
三、把容器当作表格单元
CSS 提供一系列diplay属性值，包括 display: table, display: table-row, display: table-cell 等，能把元素当作表格单元来显示。这是再加上 vertical-align: middle, 就和表格中的 valign="center" 一样了。
.middle-demo-3{
display: table-cell;
height: 300px;
vertical-align: middle;
}
可惜IE不支持这些属性，不过在其他浏览器上显示效果非常完美。
要注意的是：和一个合法的<td>元素必须在<table>里一样，display: table-cell 元素必须作为 display: table 的元素的子孙出现。
优点：
不用说了吧，就是表格，效果和表格一模一样
缺点：
IE下无效
四、以毒攻毒！用 IE 的 bug 解决 IE 中的绝对居中
先不得不说一句，IE 真的是个很烂的浏览器，CSS1中的定义都不支持，害得要我们转个大圈子来造居中。不过就像我说的，凡是 table 布局可以实现的，CSS 一定可以实现，即使在 IE 里也不例外。我研究 IE layout 模式多年，还是找出了一个可以在 IE 中绝对居中的方法。这个方法就是基于 IE layout 的 bug，也可以算以毒攻毒。至于原理，不要问我，这是独门秘学，何况三言两语也讲不清楚，只要好用就行
.middle-demo-4{
height: 300px;
position: relative;
}
.middle-demo-4 div{
position: absolute;
top: 50%;
left: 0;
}
.middle-demo-4 div div{
position: relative;
top: -50%;
left: 0;
}追问我对你们这些Copy党真的是很无语
浪费自己的时间 去浪费别人的时间 你们图个什么劲这是
热心网友
时间：2022-04-20 07:44
一、如果能排除硬件上的原因（内存条不兼容，更换内存。显卡驱动是否正确按装或者是否被恶意覆盖否？）往下看：
二、系统或其它软件引起的，可用下述方法处理： 系统本身有问题，及时安装官方发行的补丁，必要时重装系统。 病毒问题：杀毒,建议使用诸如金山毒霸(免费)卡巴(收费)等高质量杀毒软件对电脑杀毒
三、浏览器出现内存不能读、写的提示：
1、运行→regedit→进入注册表, 在→
HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Explorer\ShellExecuteHooks
这个位置有一个正常的键值{AEB6717E-7E19-11d0-97EE-00C04FD91972}, 将其他的删除。
2、打开CMD窗口输入如下命令:
for %i in (%windir%\system32\*.dll) do regsvr32.exe /s %i 回车
for %i in (%windir%\system32\*.ocx) do regsvr32.exe /s %i 回车
两条分别运行完成后重启机器。
热心网友
时间：2022-04-20 09:18
现在能想到的：
一、细心检查不显示那部分代码有没错漏。
二、把文档声明（DTD）删掉试试。
三、把编码改为gb2312
四、在页面 右击＞编码＞自动（或UTF-8）
上面几点，自己各试试。追问谢谢你的提示 虽然也不正确 但你比其他人的回答要靠谱的多
我之所以不帖代码或给演示页面 是因为我想知道造成这问题的原因
而非具体案例的解决方法
追答=@=,忘了个css。排查的话，如果写css按由大到小的话倒是好办，主要集中头部与内容区交界处的css进行排查就可，如果乱写，一来易出错，二来查时费时，三来费读。
建议你排查用注释法，较!important方便得多。
贴代码或演示，就算你不是图个解决方案，但也能知道问题所在。而且更能节约回答者的时间，你这么问，跟“我电脑开不了机了，请把可能的原因列出来”这种无意义问题有啥区别？
还有，懂一点技术也没什么好自傲，回答的也只是出于好意而已。
热心网友
时间：2022-04-20 11:10
热心网友
时间：2022-04-20 13:18
热心网友
时间：2022-04-20 15:42
哪么基本上出现这个问题机率是百分之*十, 原因不明
你看下你是不是也符合上面罗列的条件 后出现的这问题
解决方法是 尽可能避免上面罗列出来的条件
如果一定要使用像上面说的哪样条件下的样式 哪建议使用 if ie 注释 针对IE 单独搞一份样式
热心网友
时间：2022-04-20 18:24
热心网友
时间：2022-04-20 21:22
热心网友
时间：2022-04-21 00:36
2.查看一下你的html结构和css文件里面有中文注释吗？有时候，中文的注释会因为编码错误产生乱码影响html和样式的输出，我以前曾经历过。那次是因为css文件的中文注释编码错误变成英文乱码和css正文错误连接，造成样式混乱。
3.还有一个就是css和html文件meta设置编码最好要一致，可以尝试用记事本打开css文件-》另存为（此时在下方可以选择编码方式，选择一下utf-8），覆盖保存，试一下。或者在CSS文件最顶部放在@charset "utf-8";
反正，总之，我遇到的类似情况基本都是编码的问题，你可以参考追问我知道 在IE下 页面文档为UTF8编码时 如果使用了不严谨的JS语句
可能导致部分内容或页面内容不显示的问题 但在这里于我的情况不适用
因为我未使用任何JS 脚本
改编码是不符合实际需要的 注释影响输出 这个我还真是头次听说
系统默认的记事本不能很好的处理UTF8编码文档 这是常识
不过 谢谢你的回答
追答我想你可能没明白我的意思，在css 中用中文注释，如果编码错误的话，生成的乱码可能会和css内容部分错误结合，因为不同文件编码不同步的话，html页面去包含外部文件的时候就可能按照它自己的编码方式进行。这只是中情况，我并没说这一定会发生。
系统默认的记事本不能很好的处理编码是有时候当没有BOM的时候记事本不能严格区分ANSI文件和UTF-8文件，但是通过另存为重选编码是一种简单一些的方法，我只是想说明你可以尝试同步编码来解决问题，并不是说你一定要按照我说的是使用记事本同步还是其他的平台。
如果你做过DotNet开发，或者使用过vs平台，可能你会发现，它自带的编译器好用的多，
你看一下这个可能有帮助：
http://hi.baidu.com/lssbing/blog/item/d2074a1635763910972b43d8.html
热心网友
时间：2022-04-21 04:08
2.文字颜色和背景色相同
3.z-index不在最底层
4.代码书写不规范
热心网友
时间：2022-04-21 07:56
热心网友
时间：2022-04-21 12:00
热心网友
时间：2022-04-21 16:22
不过依然感谢你的回复
追答我给你个网址你到那里去看下应该有你的答案。
http://www.blueidea.com/bbs/NewsDetail.asp?DaysPrune=5&lp=1&id=1867404
