zoukankan      html  css  js  c++  java
  • 关于IE6/7的 inline-block

    今天在写代码的时候使用了inline-block,但是很意外的在IE6/7下此属性不给力~~

    但是由于我既需要他是个内联数据,又要设置它的宽度设置block,所以只能使用inline-block。

    所以解决方案有两种:

    (1)先让其成为内联数据,即先是<span>元素,再设置inline即可生效,此时会触发IE的layout产生相似效果。

    <span style="display:inline-block"></span> <!--不能用div-->

    (2)直接设置为inline,再利用zoom来触发layout来实现类似效果。

    div { 
      width:400px; 
      height:200px; 
      *display:inline; 
      *zoom:1; 
    } 

    (2)先触发lay-out,再设置为inline。但必须在两个css中才行

    div { 
      width:400px; 
      height:200px; 
      display:inline-block; 
    } 
     div { 
      display:inline; 
     } 

    具体见:http://www.jb51.net/css/42500.html

    但是,由于在做js的时候,传入了对象,为了不改变对象的默认行为,如div的自动换行行为,选择了第一种解决方式,即将传入的对象节点内部添加了新的span节点,并将源节点内容放入了新span节点中,将内部span的margin、padding设置为0即可。

  • 相关阅读:
    Git
    Qcon2016上海站PPT
    TeamCity
    在cmd界面,怎么样退出Node.js运行环境
    python 2.x与python3.x的区别
    d3.max()与d3.min()
    d3.svg.line() 曲线构造器
    d3.js 之SVG:矢量化图形绘制
    moment.js 时间格式化库
    directive
  • 原文地址:https://www.cnblogs.com/zldream1106/p/Iinline-block_OF_IE6_IE7.html
Copyright © 2011-2022 走看看