手机
当前位置:查字典教程网 >网页设计 > Div+Css教程 >IE6下 vertical-align:middle 和 height 引发的边框消失
IE6下 vertical-align:middle 和 height 引发的边框消失
摘要:css样式:ul{list-style:none;}li,div{border:1pxsolid#ff0000;vertical-align...

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下没事,且文字不能居中(如图)。

IE6下 vertical-align:middle 和 height 引发的边框消失1

html结构2

<div>测试</div>

测试文字

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

边框就显示出来了

html结构3

<div>测试</div>

<div>测试二</div>

<div>测试3</div>

IE6下 vertical-align:middle 和 height 引发的边框消失2

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

【IE6下 vertical-align:middle 和 height 引发的边框消失】相关文章:

纯CSS做的带开关的台灯

CSS之overflow属性用法

input标签写CSS时需要注意的几点

CSS常见属性缩写与全写对比

几款不错的按钮样式

html空格代码

总结CSS简写方法

CSS网页右下角广告的布局实例

使用CSS布局定位属性轻松实现优美站点布局

css中默认中文字体font-family列表

精品推荐
分类导航