zoukankan      html  css  js  c++  java
  • IE6/7中不支持inline-block,如何解决

    1、IE6/7不识别inline-block,只是触发了layout,表现跟真实一样。
    2、IE6/7不完全支持inline-block,只对内联元素有效。

    IE下块元素如何实现 display:inline-block 的效果?
    有两种方法:
    1、先使用 display:inline-block 属性触发块元素,然后再定义 display:inline,让块元素呈递为内联对象(两个display 要先后放在两个 CSS 声明中才有效果,这是 IE 的一个经典 bug ,如果先定义了 display:inline-block,然后再将 display 设回 inline 或 block,layout 不会消失)。代码如下(…为省略的其他属性内容):
    div {display:inline-block;...}
    div {display:inline;}
    2、直接让块元素设置为内联对象呈递(设置属性 display:inline),然后触发块元素的 layout(如:zoom:1 等)。代码如下:
    div {display:inline; zoom:1;...}

    最后问题可以这样解决:

    .nav{text-align:center;}

    .nav ul{display:inline-block !important;*display:inline;zoom:1;margin:0;padding:0;}

    display:inline-block !important;能在FF,IE7以上的浏览器中实现,因为他们支持;

    *display:inline能使IE6保持行内元素,zoom:1能触发IE6的layout,就能实现display:inline-block的效果。

  • 相关阅读:
    信息安全系统设计基础 第12周学习笔记
    信息安全系统设计基础 第11周学习笔记
    信息安全系统设计基础 第10周学习笔记
    logstash使用
    remi
    redis 自启动
    求相对路径的函数
    java json
    一个php的爬虫,将笔趣阁的书可以都下载下来。
    php写插件
  • 原文地址:https://www.cnblogs.com/jiangwenli/p/4902729.html
Copyright © 2011-2022 走看看