目标：

　　使ul列表横排显示

现象：

　　谷歌OK，火狐竖排，IE竖排。

原因：

　　ul原css代码：

　　首先，去除点号，list-style:none;为了使其横排，使用了display:contents;该样式在IE上无法识别，在火狐上则不稳定。

解决方法：

　　将display:contents改成flex-direction: row;，保险起见，可以设置浮动和字体对齐都是左对齐。

ul列表li元素横排显示的IE兼容性问题的更多相关文章

  1. html中让多个li标签横排显示

    1.我们可以通过为ul标签下所有li标签设定样式“display:inline-block”的方式,让多个li标签横排显示 2.除了以上方法,我们还可以所有li标签使用float(浮动)的方式,让多个 ...

  2. ul的li元素水平并居中的css

    ul{ text-align:center; } li{ display:inline } 这样li元素不需要float且可以居中 比较好样式如下 ul li { // float: left; pa ...

  3. 如何使ul中li元素横向排列且不换行

    外层div容器宽度固定,ul宽度随li(li宽度固定)的增加而撑开,但是当ul中li的宽度之和大于div时,ul没有撑开,而是li换行了,如何使li不换行? 解决方法:主要是外面容器设置为white- ...

  4. 清除li内a标签的float=left实现a标签在li内居中显示(ul内li不居中显示)

    写在前面: 修改cnblogs主页面菜单显示问题. 问题描述:在给主菜单添加hover样式后发现菜单内容并未居中.见图1. 网上搜索到资料其中一篇讲的可以说简明扼要了,也是伸手党的福利(点我查看原文) ...

  5. ul中li元素横向排列且不换行

    ul { white-space: nowrap; } li { display: inline-block; }     white-space 属性设置如何处理元素内的空白. normal 默认. ...

  6. ul、li实现横向导航按钮

    好久没写博客了,主要是懒得呼气都不想呼,上周分给我一个新的任务,就是自己新建一个系统,快速极限开发,虽然之前自己也做过小的系统,但毕竟是自己做,随着自己的心意做,没有做其他的限制等,现在呢是给公司做, ...

  7. 用ul、li做横向导航

    /* ul li以横排显示 */ /* 所有class为menu的div中的ul样式 */ div.menu ul { list-style:none; /* 去掉ul前面的符号 */ margin: ...

  8. ul列表元素在float：right后li元素倒转

    发现对li元素进行float:right后,虽然成功右浮动,但是的元素是倒转的 解决方案: 对ul进行右浮动,然后对li左浮动 结果

  9. ul li设置横排，并除去li前的圆点

    效果预览:http://hovertree.com/texiao/css/ 如何用CSS制作横向菜单 让ul li横向排列及圆点处理 我们先建立一个无序列表,来建立菜单的结构.代码是: <ul& ...

随机推荐

  1. 【flask】使用类组织配置-使用工厂函数创建程序实例

    [需求] 使用配置类管理flask管理测试环境, 通过1个参数即可控制Flask是运行develpment环境还是production环境(数据库配置,邮件配置也要根据环境的变化而变化) [思路] 1 ...

  2. go-ethereum开发问题

    1. abigen 参考文档(Native DApps: Go bindings to Ethereum contracts) abigen --sol token.sol --pkg token - ...

  3. 详析静态网站与动态网站区别（服务器ip dns 端口）

    几个基本知识 1.服务器:能够提供服务的机器 取决于机器上所安装的服务软件     1) web服务器:提供web服务(网站访问) 就需要安装web服务软件,Apache,tomcat,iis等 2. ...

  4. dcef3 基本使用经验总结

    dcef3 基本使用经验总结 https://www.cnblogs.com/h2285409/p/10517483.html 加载命令启动参数    --enable-system-flash 会加 ...

  5. flex布局使用方法简要汇总

    近期因为使用inline-block,在项目部署后出现了一点小问题,几番解决未果,遂使用flex布局,于是借此机会对flex布局的用法做一个简要的汇总. 遇到的bug如下: 本想两个div使用inli ...

  6. python学习之那些由print引起的困惑

    该文索所起之因:在练习列表的操作时,要输出一波操作后的列表,但是一直让本人耿耿于怀的时下边的这个现象: 红色框框里是字符串,黄色框框里是列表,同样是只对一个元素进行的操作,为啥输出时字符串是作为一个整 ...

  7. linux 更改文件权限命令 chmod

    chmod -change file mode bits :更改文件权限 chmod是用来改变文件或者目录权限的命令,但只有文件的属主和超级用户(root)才有这种权限. 更改文件权限的2种方式: 一 ...

  8. python 并发编程 多线程 GIL全局解释器锁基本概念

    首先需要明确的一点是GIL并不是Python的特性,它是在实现Python解析器(CPython)时所引入的一个概念. 就好比C++是一套语言(语法)标准,但是可以用不同的编译器来编译成可执行代码. ...

  9. 写 JSP 的痛点，真的非常痛！

    一.前戏 前后端分离已成为互联网项目开发的业界标准使用方式,通过nginx+tomcat的方式(也可以中间加一个nodejs)有效的进行解耦,并且前后端分离会为以后的大型分布式架构.弹性计算架构.微服 ...

  10. 干货 | 深入分析 string.intern() 方法

    首先我们来看一段代码: public class InternTest {      public static void main(String[] args) {     String str1 ...