IE6 line-height 失效

最新推荐文章于 2026-04-04 12:10:24 发布

原创最新推荐文章于 2026-04-04 12:10:24 发布 · 856 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

Web前端技术

当前文章被收录于：

Web前端技术

9 篇文章 0 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

本文介绍了在Internet Explorer 6中遇到的line-height失效问题及其解决方案。当容器内的文字与img、input等元素相邻时，设置的行高可能失效且元素行高可能翻倍。文章提供了调整元素边距及垂直对齐的解决方法。

今天弄页面排版，发现line-height在IE6中失效啦！！~~

在网上找了一下解决方法：

BUG症状：当在一个容器里文字和img、input、textarea、select、object等元素相连的时候，对这个容器设置的line-height数值会失效；同时以上元素的行高可能×2：

受影响的浏览器：
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