BUG症状：当在一个容器里文字和img、input、textarea、select、object等元素相连的时候，对这个容器设置的line-height数值会失效；
受影响的浏览器：
Microsoft Internet Explorer 5.01 / Windows
Microsoft Internet Explorer 5.5 / Windows
Microsoft Internet Explorer 6
解决方法：
对和文字相连接的img、input、textarea、select、object等元素加以属性
margin: (所属line-height-自身高度)/2px 0;
vertical-align:middle
检验好用，不过用户具体使用中要留意设置属性的img、input等很可能不是全局设置，这个时候就要灵活处理，比如一个页面有两个不同line-height属性的容器A(class="a")和容器B(class="b")里都有img、input等，如果是B处遇到此bug，则css里写* .b img {...}等等，这样不影响A容器的css显示，千万不要写* html img {...}，因为后者是全局设置。
bug解决者详细说明：http://www.positioniseverything.net/explorer/lineheightbug.html
分享到：
相关推荐
通过这段代码，你可以观察不同line-height和height值下文本的对齐情况，从而更好地理解这个所谓的“3像素bug”。总之，理解line-height的工作原理以及浏览器如何解析它，对于精确控制文本的垂直对齐至关重要，尤其是...
例如，将`line-height`和`height`都设置为50px，这样可以实现文本的垂直居中，同时不会触发IE6的边框消失bug。 ```css li,div{ border:1px solid #ff0000; line-height:50px; height:50px; } ``` 2. **添加...
然而，IE6在处理这个属性时存在一个bug，它会将`line-height`与元素的`font-size`相加，而不是仅仅使用`line-height`设定的距离，从而导致了文字之间的实际间距变为正常值的两倍。 为了解决这个问题，开发者们开发...
解决这个问题的方法是使用负的`margin`来补偿，或者使用`line-height`替代`height`。 ```css #element { background: #95CFEF; border: solid 1px #36F; width: 300px; line-height: 2px; /* 使用line-height...
### IE特有Bug知识点解析 #### 一、概述 Internet Explorer（简称IE）作为曾经市场上最主流的浏览器之一，在其发展过程中积累了一系列特有的兼容性问题。这些问题是由于IE浏览器自身的技术限制以及对某些Web标准的...
例如，在标准模式下，`line-height:180%`可能会超出设定的`height`。这个问题在标准浏览器如Firefox中则不会出现。 为了避免这种错误的元素扩展，开发者可以采用以下策略： - 使用`<!DOCTYPE ...
标题与描述中所提及的知识点聚焦于CSS在不同浏览器（尤其是IE6, IE7, IE8及Firefox）中的兼容性问题及其解决方案——即所谓的“Hack”技术。在Web开发领域，由于不同浏览器对CSS的支持程度和解析方式存在差异，...
1、IE6怪异解析之padding与border算入宽高原因：未加文档声明造成非盒模型解析解决方法...1）字体大小为奇数之边框高度少1px解决方法：字体大小设置为偶数或line-height为偶数2）line-height，文本垂直居中差1px解决方
/* 解决IE下的margin加倍问题 */ } ``` ##### 3. 浮动产生的双倍距离问题 - **问题描述**：在IE浏览器中，某些元素的`margin`值可能会被误解，导致元素之间的间距超出预期。 - **解决方案**： - 将元素的`...
解决这个问题的方法之一是为布局容器使用`line-height`属性或设置固定的高宽比。 ### 8. 清除浮动与自适应高度 在使用`float`布局时，非浮动元素可能会出现在浮动元素下方，而不是按顺序排列。这是因为浮动元素...
**解决方案**：对于这种情况，可以尝试使用透明的背景图片替代高度属性，或者使用`line-height`属性结合`font-size`属性来模拟所需的高度，以此绕过IE6的限制。 ### 总结 以上四个问题是IE6中最常见的布局与样式...
本文主要针对IE6、IE7和IE8以及Firefox浏览器在DIV+CSS布局下的兼容性问题进行分析，并提供一系列解决方案。 #### 二、CSS兼容性技巧 ##### 1. **垂直居中** - **问题描述**：在某些情况下，需要将文字或元素在...
解决方法是为布局容器添加`line-height`属性，或者设定固定高度和宽度，保持页面结构简洁。 8. **清除浮动**： 清除浮动是为了防止父元素因浮动子元素而高度塌陷。可以使用`clear: both;`或创建一个清除浮动的空...
- **问题描述**：设置了`float`属性的`div`在IE下设置的`margin`会加倍，这是一个IE6已知的bug。 - **解决方案**：在该`div`中添加`display:inline;`属性。 - **示例代码**： ```css #imfloat { float: left; ...
一种解决方案是为body下的一个div设置类，然后利用`width:expression()`来实现IE的最小宽度效果。 6. **浮动文本的3像素bug**：当左侧元素浮动，右侧元素使用外边距进行对齐时，IE浏览器会出现3像素的间隙。为解决...
解决方法包括使用`line-height`属性或给div设定固定的高和宽，同时保持页面结构简洁。 8. **浮动div的闭合问题**：在CSS布局中，使用浮动（`float`）可能导致父级元素高度塌陷。解决方法通常包括清除浮动（`clear: ...
- **解决办法**：为了解决这个问题，可以通过设置`line-height`来统一文字的高度。这有助于保持页面布局的一致性，避免因为1像素的差异导致布局错乱。 ##### 2. 容器高度限定问题 - **问题描述**：在Firefox中，...
/* IE6下解决外边距合并问题 */ } ``` ### 3. 浮动元素与宽度计算问题 **问题描述**：在IE浏览器中，当元素设置了`float`属性并指定宽度时，可能会出现宽度计算不准确的问题。 **解决方案**： - **display: ...