行内元素vertical-align:middle在html5和xhtml1.0及以下版本中的表现差异
浏览:1222次 出处信息
今天在做页面的时候无意中发现静态页面中小图标和文本对的很齐的,在线上的页面却小图标和文本没有对齐。同事啄木鸟找出的原因是静态页面和线上的页面的html DOCTYPE不一样,静态页面为html5,线上的页面xhtml 1.0;一直以为xhtml和html5表现上是一样的,只是DOCTYPE不一样!
经过同事啄木鸟多番测试终于找出了差异的问题所在,那就是行内元素的vertical-align:middle样式。详细看demo1 (DOCTYPE为HTML 5)和demo2 (DOCTYPE为XHTML 1.0)。
注:
- 以上demo只测试了firefox 7和chrome,ie各个版本没有测试;
- DOCTYPE为xhtml 1.1和DOCTYPE为html5的表现一致;
- DOCTYPE为xhtml 1.0和DOCTYPE为html 4的表现一致;
产生差异的具体原因未知,未做深入学习,其他css属性不知道是不是也会存在细微的差异,如果您知道原因或者也碰到过这方面的问题,欢迎留言告知交流,感激不尽!
建议继续学习:
QQ技术交流群:445447336,欢迎加入!
扫一扫订阅我的微信号:IT技术博客大学习
扫一扫订阅我的微信号:IT技术博客大学习
<< 前一篇:css 透明度完全兼容的写法
文章信息
- 作者:愚人码头 来源: WEB前端开发
- 标签: vertical
- 发布时间:2011-10-12 00:11:23
建议继续学习
近3天十大热文
- [503] 招聘技巧一二
- [20] 可用性测试好助手——Morae软件的应用
- [17] 从数据中了解用户——数据在现有产品改版设计中
- [17] 配合jquery实现异步加载页面元素
- [17] 密度聚类算法之OPTICS
- [16] 豆瓣是啥?
- [16] linux内核研究笔记(一)内存管理 – p
- [16] 在ssh服务里使用chroot
- [16] 从数据中了解用户——数据在新产品设计中的应用
- [13] 再谈“我是怎么招聘程序员的”