先来解决下min-heigt的bug
布局过的人都知道CSS的最小高度min-height是个很有用的属性,它可以让很短的内容也有一个很合适的高度,使页面显得美观。但很可惜IE6不支持这一属性。怎么办呢?我们可以用另外一种方法让IE6也有最小高度min-height属性的效果。
众所周知,如果内容超过元素的高度,那么IE6是会自动增加元素的高度,即使你明确的定义了元素的高度。我们可以利用IE6的这个bug来让IE6也有最小高度min-height属性的效果。具体代码如下:
height:auto !important;
height:500px;
min-height:500px;
解释:
1、由于IE6对!important的解释存在bug,所以它只识别height:500px这一句,超过500px后,IE6自身会增加盒子的高度;
2、IE7和其他标准浏览器三句都能识别,虽然定义height:500px,但我们又有了height:auto !important,所以超过500px也能自动增加盒子的高度。
max-heigt的bug比较麻烦,有2种解决方法,先看jQuery方法:
if($.browser.msie&&($.browser.version === "6.0")){
$(".entry").each(function(){
if($(this)[0].scrollHeight>500)
$(this).css({"height":"500px","overflow":"hidden"});
});}
原理:
在IE6中可以通过设定height来达到max-height的效果. 循环所有要加max-height属性的DOM元素,判断他的scrollHeight大于你要设置的最大高度 如果超过了就通过设置height为最大高度,我这里使用的是[0],获取的是的DOM对象,而不是jQuery对象。
max-heigt的bug解决方法2-css表达式
height: expression( this.scrollHeight > 500 ? "500px" : "auto" ); /* sets max-height for IE */
原文地址:http://duanxin.me/articles/solve-ie6-does-not-support-the-min-height-and-max-heigt-bugs/
分享到:
相关推荐
IE6不支持`min-height`属性,但可以通过一些技巧实现类似的效果。例如: ```css #container { min-height: 200px; height: auto !important; height: 200px; } ``` 或者通过JavaScript动态计算元素的实际高度: ```...
对于**最小高度(min-height)**的支持,IE6并不理解min-height属性,而是将height当作最小高度。解决方法是使用`height:auto !important;`和`height:具体数值;`的组合,确保在IE6中至少设置一个最小高度,同时不影响...
文件还包含了一系列的解决办法,例如针对IE6和IE7的特定问题,如列表和表格的显示问题。使用特定的CSS规则,如设置`display: inline-block`或`vertical-align: middle`来解决垂直对齐的问题。 7. **CSS选择器和...
- **IE5-6/win的3像素偏移bug**:元素在垂直方向上有3像素的偏移。使用`_height: 1%;`(私有属性)可以修复。 - **E6的躲躲猫bug(peek-a-boo bug)**:元素的高度计算不正确,导致内容显示不全。同样通过`_height: ...
本文将详细探讨由IE浏览器特有的hasLayout属性引发的CSS Bug表,涉及的知识点包括hasLayout的定义、特点、触发条件以及具体的Bug案例和解决方案。为了便于理解,我们将分几个部分阐述这些知识点。 首先,hasLayout...
此外,IE7中还有一些额外的属性可以用来激发hasLayout,比如min-height、max-height、min-width、max-width、overflow及其子属性overflow-x和overflow-y(这些是CSS3的属性,目前并未被所有浏览器支持),以及...
由于IE6不支持PNG透明,你可以使用CSS滤镜来解决这个问题。例如: ```css *html #image-style { background-image: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="filename.png", ...
- 可以通过`max-width`和`max-height`属性限制元素的大小。 **Length(长度)** - 物体的延伸距离。 - 在CSS中,长度单位包括像素、厘米、毫米、英寸等。 **Medium(中等)** - 描述尺寸或程度的中等程度。 - 可以...
定位方面,除了不支持fixed的ie6用absolute,其他都使用fixed定位。 【克隆tr】 table有一个rows集合,包括了table的所有tr(包括thead和tfoot里面的)。 程序的Clone方法会根据其参数克隆对应索引的tr: this._...
- `min`和`max`:定义滑块的最小和最大值。 - `step`:滑块每次移动的步长。 - `disabled`:设置滑块是否禁用。 - `range`:是否启用多选滑块。 - `tooltip`:控制滑块上的提示框,可以是`always`(始终显示)...
这里的ROTATION_FACTOR、MIN_ROTATION和MAX_ROTATION是常量,用于控制旋转速度和角度范围。 4. **更新Matrix**:计算出新的旋转角度后,我们需要更新Matrix并将新的变换应用到图片上。 ```java private void ...
document.writeln ('<dd>07月12日 修复搜索、导航和返回顶部BUG</dd>'); document.writeln ('<dd>06月26日 改进网页背景频道预览功能</dd>'); //document.writeln ('<dd>06月23日 改进返回顶部功能</dd>'); //...