IE6下margin-bottom设置负数被隐藏的问题

想这几一个选项卡,想要的效果如下

可是在IE6中当前选项卡的底边框不会盖住父级元素的底边框,网上说父级元素要出发haslaytout,试了都不行,最后在选项卡元素中同时设置 margin-bottom:-1px; position:relative; 这样才解决问题。

这里要注意的是:选项卡元素的高度必须必父级元素高度大1px。

我的代码如下:

<ul class="tabs">

    <li class="tab cur"><a href="?id=435">?????? ???????</a></li>

    <li class="tab "><a href="?id=434">????????????</a></li>

</ul>

  

ul.tabs{display:block; padding:0 10px 0 0; margin:25px 0 0 0; height:35px; border-bottom:solid 1px #ccc; line-height:35px;}
ul.tabs li{display:block; float:right; padding:0 10px; margin:0; list-style:none;}
ul.tabs li.cur{ border:solid 1px #ccc; border-bottom-color:#fff; background-color:#fff; height:34px; margin-bottom:-1px; position:relative;}

  

时间: 2024-12-27 10:17:22

IE6下margin-bottom设置负数被隐藏的问题的相关文章

ie6下margin双倍距的问题

今天中午休息时, 公司客服突然报出来一个bug, 一个用ie6的用户打开我们活动网站时, 发现内容都错乱了, 我赶紧上线一看, 发现是正常的. 找了台ie6的xp机器再看了下, 重现出了这个用户的问题, 发现确实如此. 检查了一遍代码, 发现没有什么问题, 测来测去发现也只有ie6会这样, 而且距离始终多了一倍! 百思不解于是就上网搜了下, 发现原来是因为"大名鼎鼎"的ie6margin双倍bug. 解决方案: 解决方案还简单, 只要给对象的css属性加上 display:inline

IE6下margin双倍边距Bug的处理办法

改了一天,我才发现了问题,除了IE6双倍边距之外,其他的浏览器都没有问题,为此改了无数次的代码.为了修复双倍边距bug,整理了一下的资料. 一.什么是双边距Bug? 先来看图: 我们要让绿色盒模型在蓝色盒模型之内向左浮动,并且距蓝色盒模型左侧100像素.这个例子很常见,比如在网页布局中,侧边栏靠左侧内容栏浮动,并且要留出内容栏的宽度.要实现这样的效果,我们给绿色盒模型应用以下CSS属性: 以下为引用的内容:.floatbox { float: left; width: 150px; height

IE6下无法设置滚动条颜色怎么办

IE6下无法设置滚动条颜色怎么办:一般设置滚动条样式的时候会使用如下CSS代码: body { scrollbar-face-color:#f6f6f6; scrollbar-highlight-color:#fff; scrollbar-shadow-color:#eeeeee; scrollbar-3dlight-color:#eeeeee; scrollbar-arrow-color:#000; scrollbar-track-color:#fff; scrollbar-darkshado

老生常谈:ie6下,a标签href设置javascript:void(0);后绑定的click失效

老生常谈:ie6下,a标签href设置javascript:void(0);后绑定的click事件,如果有form表单提交或跳转等事件,会失效!举例: <a id="id_back" href="javascript:void(0);" title="返回管理">返 回</a> $("#id_back").click(function(){         $("#id_frm").

ie6下兼容问题

最小高度问题:overflow:hidden 在ie6.7下 li本身不浮动 内容浮动 li产生3像素间隙 解决:vertical-align:top; 二.当ie6下最小高度问题和li间隙问题共存时 给li加浮动 滤镜:标准浏览器[opacity:0.5] ie6[filter:alpha(opacity=50)] 图片底部3像素问题:vertical-align:top; padding是占位置的. ie6下 子元素会撑开父级设置好的宽高  : 计算一定要正确,不要让内容的宽高,超出设置的宽

IE6下兼容问题(转载)

()1.终极方法:条件注释 <!--[if lte IE 6]> 这段文字仅显示在 IE6及IE6以下版本. <![endif]--> <!--[if gte IE 6]> 这段文字仅显示在 IE6及IE6以上版本. <![endif]--> <!--[if gt IE 6]> 这段文字仅显示在 IE6以上版本(不包含IE6). <![endif]--> <!--[if IE 5.5]> 这段文字仅显示在 IE5.5. &

IE6下png背景不透明——张鑫旭博客读书笔记

从今天开始跟着大牛张鑫旭的步伐,每天进步一点点 问题:IE6不支持png背景透明或半透明 一.可解决的方法 补充:css滤镜主要是用来实现图像的各种特殊效果.(了解) css滤镜的标识符是"filter",总体的应用上和其他的css语句相同.css滤镜可分为基本滤镜和高级滤镜两种.css滤镜分类 CSS滤镜 可以直接作用于对象上,并且立即生效的滤镜称为基本滤镜.而要配合JavaScript等脚本语言,能产生更多变幻效果的则称为高级滤镜. 只有IE可以完全的支持滤镜,Firefox支持部

ie6下常见的bug 调整页面兼容性

ie6下常见的bug 我们布局页面,首先符合标准,如何写一个页面的标准性? 但是ie6等浏览器本身就比较特殊,bug比较多,兵法云,知己知彼百战百胜.我们需要了解ie6的一些常见bug,这样,更好的调试兼容性,下面小强老师就把一些常见的ie6bug列出来,大家去研究下. 考虑结构的稳定性最常见的问题就是网页元素位置混乱,错位. 1.1.1.DOCTYPE 必须有 必需在开头处使用<!DOCTYPE>标记为所有的XHTML文档指定XHTML版本和类型,只有这样浏览器才能将该网页作为有效的XHTM

CSS在IE6下的一些BUG和兼容性问题

在IE6,7下面PNG图片问题: 在IE6下,不支持PNG透明图片,解决办法是:在HTML里加上以下一段代码,其中DD_belatedPNG_0.0.8a.js文件可以在百度上找到,DD_belatedPNG_0.0.8a.js是国外一个大神写的JS文件. <!--[if IE 6]> <script src="js/DD_belatedPNG_0.0.8a.js"></script> <script> DD_belatedPNG.fix