vertical-align及IE7下的inline-block
在IE7下,是不支持inline-block元素的,当对块级元素如dl进行inline-block样式设置时,在IE7浏览器是下样式是不会生效的。
若要在IE7下实现将块级元素设置为内联元素,可以这样进行设置:
*display:inline;
*zoom:1; //获取布局
在这样设置之后,就能继续设置其他的样式了。
很多时候,在IE7下将块级元素设置为内联元素时,我们可能会想到进行float浮动来实现,float了的元素是无法设置vertical-align的,因为vertical-align只适用于内联元素。
因此想要在IE7下完美实现将块级元素渲染成内联且bottom对齐,方法为:
*display:inline;
*zoom:1;
*vertical-align:bottom;
总结:
1)vertical-align适用于内联元素;
2)IE7下inline-block无效,需要用inline并且要获取到布局(如设置width,height,zoom等)。
vertical-align及IE7下的inline-block的更多相关文章
- text-align:center;在ie7下,父级加上会让block状态的子元素居中。
text-align:center:在ie7下,父级加上会让block状态的子元素居中.ie8以上不会.
- IE6/IE7下:inline-block解决方案
IE6/IE7下对display:inline-block的支持性不好. 1.inline元素的display属性设置为inline-block时,所有的浏览器都支持: 2.block元素的displ ...
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- 关于ie7下display:inline-block;不支持的解决方案
关于ie7下display:inline-block:不支持的解决方案 今天码的时候遇到这个问题了. 如果本身是内联元素的,把它的display属性设置设置为inline-block时,所有浏览器都是 ...
- What is Vertical Align?
https://css-tricks.com/what-is-vertical-align/ ************************************************* CSS ...
- IE6/IE7下:inline-block不兼容的问题
IE6/IE7下对display:inline-block的支持性不好. 1.inline元素的display属性设置为inline-block时,所有的浏览器都支持: 2.block元素 ...
- 【css】ie6 和 ie7 下 position 与 overflow 的问题
前几天做的项目中碰到这样一个问题,在 ie6 和 ie7 下,给父元素设置 overflow:hidden 不起作用无法隐藏,后来发现是子元素中有设置 position:relative,如果子元素删 ...
- IE6/IE7下绝对定位position:absolute和margin的冲突问题解决
首先我们来看一个代码: 复制代码代码如下:<div id=”layer1″ style=”margin:20px; border:1px solid #F88; width:400px; “&g ...
- IE6和IE7下绝对定位position:absolute和margin的冲突问题解决
绝对定位的Position:absoulte的元素,会让相邻的兄弟元素的margin-top失效.而如果去掉了兄弟元素的高度又会正常. <div id="layer1" st ...
随机推荐
- java基本数据类型包装类
Java语言是一个面向对象的语言,但是Java中的基本数据类型却是不面向对象的,这在实际使用时存在很多的不便,为了解决这个不足,在设计类时为每个基本数据类型设计了一个对应的类进行代表,这样八个和基本数 ...
- 关于python文件操作
http://www.cnblogs.com/rollenholt/archive/2012/04/23/2466179.html 总是记不住API.昨晚写的时候用到了这些,但是没记住,于是就索性整理 ...
- [课程设计]Scrum 1.5 多鱼点餐系统开发进度(点餐页面框架修复及继续布置)
Scrum 1.5 多鱼点餐系统开发进度(点餐页面框架修复及继续布置) 1.团队名称:重案组 2.团队目标:长期经营,积累客户充分准备,伺机而行 3.团队口号:矢志不渝,追求完美 4.团队选题:餐厅 ...
- 2015弱校联盟(1) - E. Rectangle
E. Rectangle Time Limit: 1000ms Memory Limit: 65536KB 64-bit integer IO format: %lld Java class name ...
- Jquery 复习练习(01)
Jquery 复习练习 window.onload = function() {} == $(function() {}); 千万注意:js对象和jq对象的区别,这也是常常犯的错误 js对象举例: w ...
- FreeSWITCH无法读取wav文件
错误日志如下: -- :: Invalid file format [wav] /suite-espanola-op--leyenda.wav]! -- :: Can't open /usr/loca ...
- springMVC简单示例
1.新建web工程 2.引入springframework架包 3.配置文件 web.xml <?xml version="1.0" encoding="UTF-8 ...
- touch穿透
出现穿透的前提:上层绑定touch事件,下层绑定click事件. 解决方案:touchend绑定: e.preventDefault();$(下层).css("pointer-events& ...
- springMVC,mybatis配置事务
首先应该对context:include-filter和context:exclude-filter有一个了解,include是包含这个,而不是只包含,下面会有例子看看: 这是我最开始配置的MVC的配 ...
- gameui-for-phaser-js更新到最新版本
Hola Cantk是一个功能强大的游戏引擎,它拥有丰富的GUI控件,配合Hola Studio可以快速开发出游戏的UI界面.Phaser是一个流行而且强大的游戏引擎,但是它的GUI控件很少,而且缺乏 ...