今天在写代码的时候使用了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:;
}

(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即可。

关于IE6/7的 inline-block的更多相关文章

  1. inline,block,inline-block的区别

    display:block block元素会独占一行,多个block元素会各自新起一行.默认情况下,block元素宽度自动填满其父元素宽度. block元素可以设置width,height属性.块级元 ...

  2. 块状元素和内联元素 【inline block】

    // 9) { colorRandom += colorArray[randomV - 10]; } else { colorRandom += randomV; } } currentEle.css ...

  3. inline, block, and inline-block

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  4. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  5. inline,block,inline-block解析

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  6. inline-block,inline,block,table-cell,float

    float:left ---------------------------------------------------------------------------------------- ...

  7. CSS3如何去除 inline block 元素之间多出的空格

    display: inline-block 属性很好的避免了元素的浮动问题,但是会有点小问题,就是 inline-block 元素间的回车会被显示为一个空格.然而,我们写代码时,都是用回车来格式化的. ...

  8. CSS 概念 Block Inline Containing block

    Block 元素 包括 "block-level box," "block container box," and "block box" ...

  9. [CSS3] CSS Display Property: Block, Inline-Block, and Inline

    Understanding the most common CSS display types of block, inline-block, and inline will allow you to ...

  10. IE6+未知尺寸元素水平垂直居中

    首先讨论在IE8以上(也就是支持伪元素after的基础上)的2种情况 当有一段不知道长度大小的文字在你面前,你需要使它垂直居中的时候,你肯定会想到:1.text-align:center;水平居中没错 ...

随机推荐

  1. svn out of date

    out of date说明这个文件过期了,也就是已经有过一次提交的版本,当前提交的版本号小于当前的版本. 解决办法:先将文件update一下,然后再提交.

  2. android studio 0.8.11 如何导入Library(新手向)

    网上下了个ViewPagerIndicator的库,下载下来是个zip包,解压开来,里面有一个library和一个sample文件夹,还有一些其他的配置文件. 其中library就是我们新项目中要引入 ...

  3. c# key event

    使用C#写ui时,希望能够读取到键盘输入的事件,用于快捷键或者其他操作.本文记录操作创建key event的方法. 参考链接: http://csharp.net-informations.com/g ...

  4. dede完美分页样式

    html <div class="dede_pages">              <ul class="pagelist">     ...

  5. 深入浅出 React Native:使用 JavaScript 构建原生应用

    深入浅出 React Native:使用 JavaScript 构建原生应用 链接:https://zhuanlan.zhihu.com/p/19996445 原文:Introducing React ...

  6. procps包里面的sysctl命令

    procps包里面的sysctl命令 --http://www.cnblogs.com/createyuan/p/3740917.html?utm_source=tuicool&utm_med ...

  7. idea 的问题

    IDEA的maven项目中,默认源代码目录下的xml等资源文件并不会在编译的时候一块打包进classes文件夹,而是直接舍弃掉. 如果使用的是Eclipse,Eclipse的src目录下的xml等资源 ...

  8. mongoose的promise(转发)

    Switching out callbacks with promises in Mongoose Published on July 28, 2015 mongo node mongoose pro ...

  9. jboss漏洞导致服务器中毒

    中毒现象 1. 网络出现拥塞,访问延迟增加. 2. 系统定时任务表中出现异常的定时任务. 3. 出现异常进程. 4. $JBOSS_HOME/bin或/root目录下出现大量的异常文件.     现象 ...

  10. AutoMappeer自动映射

    AutoMapper是用来解决对象之间映射转换的类库.对于我们开发人员来说,写对象之间互相转换的代码是一件极其浪费生命的事情,AutoMapper能够帮助我们节省不少时间.