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

css样式:style type=text/cssul{ list-style:none;}li,div{border:1px solid #ff0000; vertical-align:middle; height:50px;}/stylehtml结构:div测试/div(注意:div测试/div后面没有其他文字或元素
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;
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

在写CSS样式编码时,难免会遇到对特定的浏览器进行样式设定。在讲述CSS的Hack前,先来了解下什么是CSS Hack?什么
非IE6下的写法大家一般都清楚如何写;这里就不展示了;切入正题,以下的IE6下CSS的兼容性写法:
HTMLHEADTITLEtextarea宽度、高度自动适应处理方法/TITLE!-- 控制宽度的自动适应 --style type=text/css.comments { width:100%;/*自动适应父布局宽度*/ overflow:auto; word-break:break-all;/*在ie
最近网站做改版,又发现一个ie6奇葩的问题,就一个很普通带边框的按钮,但在ie6中下边框不显示,ie7没有测试不知道是不是也不显示,其他浏览器正常 代码和预览效果如下: style b
按钮在IE6中点击时1px黑边框的最常见的解决方法 首先设置按钮为none,然后在按钮外面套一层来实现边框的效果,部分代码如下 .btnbox{ border:solid 1px red;} .btn{ border:none;} span class=btnboxinp
跟版精品模板网提供exec,等网页设计素材资源,提供相关网页设计资源的教程和免费下载。跟版网,专业织梦网页设计模板资源站。。