当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > IE6下 vertical-align:middle 和 height 引发的边框消失

CSS样式表
可以给img元素设置背景图
不通过JavaScript实现的自动滚动视差效果
学DIV+CSS技术,如何入门?
XHTML+CSS制作样式风格切换的WEB站点
解决IE6.0、IE5.0、IE5.5差异
DIV+CSS制作的个性水平导航菜单实例
css里expression实现界面对象的批量控制
利用CSS框架进行高效率的站点开发 Elements
CSS模块化设计:从空格谈起
在IE流览器中正确显示PNG透明图片
CSS样式表创建美妙绝伦的网站
性感的CSS菜单(Menus)
CSS教程关于css框架网页设计
以HTML为基础学习DIV+CSS
提高CSS文件可维护性的五种方法
dl、dt、dd 标记来改造163邮箱的广告条
WEB前端涉及的布局、结构化和标准化
CSS网页制作布局实例教程
CSS教程:认识层叠规则互相作用
ul结合CSS制作网页相册滑动浏览效果

CSS样式表 中的 IE6下 vertical-align:middle 和 height 引发的边框消失


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-12   浏览: 152 ::
收藏到网摘: n/a

css样式:
<style type="text/css">
ul{ list-style:none;}
li,div{border:1px solid #ff0000; vertical-align:middle; height:50px;}
</style>

html结构:
<div>测试</div>

(注意:<div>测试</div>后面没有其他文字或元素)
现象:
div的下边框消失,在ff下没事,且文字不能居中(如图)。


html结构2
<div>测试</div>
测试文字

--在后面再加上其他元素

边框就显示出来了

html结构3
<div>测试</div>
<div>测试二</div>
<div>测试3</div>

结论:如果是为了文字居中,把line-height和height设置为相同的高度。不要多写
vertical-align:middle;