当前位置：首页 → 问答吧 → ie下固定高度被撑开的疑惑

ie下固定高度被撑开的疑惑

时间：2011-10-13

来源：互联网

想实现的效果是当前li的背景色可以遮住ul的border-bottom，在ie7，8 firefox下都没有问题，唯独ie6下ul被撑开，请问如何解决？

附件

ttt1.jpg (6.81 KB)

2011-10-13 09:08

作者: hai0163 发布时间: 2011-10-13

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <style type="text/css"> *{margin:none; padding:none; list-style:none;} ul{height:37px; line-height:37px; border-bottom:1px solid red;} li{ float:left; height:34px; margin-right:5px; border:1px solid #ddd; border-bottom:none; width:120px;overflow:hidden;display:inline;text-align:center;position:relative;top:2px;_top:6px;} .current{ top:-3px;_top:0;height:37px;line-height:37px;border-top:4px solid red; border-color:red; background:#fff; overflow: hidden; position:relative;} </style> <ul> <li class="current">商品介绍</li> <li>包装详情</li> <li>用户评价</li> </ul> </body> </html>
提示：您可以先修改部分代码再运行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> <style type="text/css"> *{margin:none; padding:none; list-style:none;} ul{height:37px; line-height:37px; _overflow:hidden;border-bottom:1px solid red;} li{ float:left; height:34px; margin-right:5px; border:1px solid #ddd; border-bottom:none; width:120px;overflow:hidden;display:inline;text-align:center;margin-top:2px;} .current{top:-5px;height:37px;line-height:37px;border-top:4px solid red; border-color:red; background:#fff; overflow: hidden; position:relative;} </style> <ul> <li class="current">商品介绍</li> <li>包装详情</li> <li>用户评价</li> </ul> </body> </html>
提示：您可以先修改部分代码再运行

[ 本帖最后由 wd513517 于 2011-10-13 10:03 编辑 ]

作者: wd513517 发布时间: 2011-10-13

.current{ top:0px;height:35px; border-top:1px solid red; border-color:red;

background:#fff; overflow: hidden; position:relative;}

top和border-top改下

作者: 4511916 发布时间: 2011-10-13