由于项目中使用ul+li的布局方式,在ie8、chrome浏览器中,包裹浮动的li元素的外层ul高度为0,ie7浏览器和ie8兼容模式显示正常,这是典型的浏览器兼容性问题。

解决办法:

第一种:设置ul的style属性

代码如下: overflow:hidden;//超出元素纬度范围的内容的可见性:隐藏

第二种:设置ul的style属性

代码如下: float:left; //浮动:左

第三种:在ul标记内加空div

代码如下: <div style=" clear:both; visibility:hidden;">

ul标签的高度为0的更多相关文章

  1. li浮动时ul高度为0,解决ul自适应高度的几种方法

    网址:http://www.gxchina.com/edu/11208.html 1.给ul元素设置高度height最直接的办法是给ul元素设置一个高度,即ul标签添加height属性,代码如下: u ...

  2. HTML——b i del a p img h1 h2 h3 h4 h5 h6 hr ol ul 标签的使用方法详解

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. JQuery中两个ul标签的li互相移动实现方法

    这篇文章主要介绍了JQuery中两个ul标签的li互相移动实现方法,可实现ul标签中li标签内容相互替换的技巧,涉及jQuery操作页面元素的相关技巧,需要的朋友可以参考下 本文实例讲述了JQuery ...

  4. css浮动中避免包含元素高度为0的4种解决方法

    问题:当子元素中使用了float时,如果其父元素不指定高度,其高度将为0 解决:清除(闭合)浮动元素,使其父div高度自适应 方法一:额外标签+clear:both     (W3C推荐方法,兼容性较 ...

  5. a标签里面包含img标签,出现a标签的高度高于img标签好几个px

    问题:a标签里面包含img标签,出现a标签的高度高于img标签好几个px 解决: a元素下有一个匿名文本,这个文本外有一个匿名行级盒子,它有的默认vertical-align是baseline的,而且 ...

  6. JQuery中两个ul标签的li互相移动

    实例 <html > <head> <meta http-equiv="Content-Type" content="text/html; ...

  7. HTML中的ul标签

    UL格式: <ul> <li>Coffee</li> <li>Tea</li> <li>Milk</li> < ...

  8. 设置select标签的高度

    当无法给select标签设置高度的时候,给他加一个背景色,就可以设置了.

  9. js不需要知道图片宽高的懒加载方法(经过实际测试,不加宽高仍然是无法正常加载的,设置height:auto,height:100%,仍然显示高度为0)

    js不需要知道图片宽高的懒加载方法 懒加载是如何实现的? - 简书https://www.jianshu.com/p/e86c61468285找到一个不需要知道图片宽高的懒加载方法了(经过实际测试,不 ...

随机推荐

  1. ns3 回调机制

    (1)目的:为了实现两个模块之间的通信(这两个模块没有任何依赖关系) (2) C语言中的函数指针 int (*a)(int q) = 0; //声明一个函数指针a,初始值设为0 //. //. //. ...

  2. Linux操作系统(二)

    SSD工作原理:http://www.360doc.com/content/15/0318/15/16824943_456186965.shtml HHD工作原理:http://blog.csdn.n ...

  3. Intellij IDEA中file size exceeds configured limit解决

    把Hadoop源码导入IDEA中后,其中有个ClientNamenodeProtocolProtos文件代码高达82997行,IDEA直接就不把它当java类看了,报file size exceeds ...

  4. 蜗牛慢慢爬 LeetCode 11. Container With Most Water [Difficulty: Medium]

    题目 Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, ai ...

  5. Beta阶段——第三篇 Scrum 冲刺博客

    i. 提供当天站立式会议照片一张: ii. 每个人的工作 (有work item 的ID) (1) 昨天已完成的工作: 账单与舍费余额数据库关联,删除功能 (2) 今天计划完成的工作: 账单排序显示 ...

  6. laravel报404错误与NGINX报404错误区别

      nginx自己配置的404页面 和laravel配置的404页面:如果报了404 :执行laravel的404页面: 那这个404页面对nginx来说意味着什么    laravel 路由和页面找 ...

  7. macOS & SVN

    macOS & SVN mac 下已经自带了svn环境; 使用 svn –version 查看版本号 安装方法: 已安装 XCode,只需要在 code > Preferences &g ...

  8. python自动化之读写

    ############################################################################# #############在Windows上 ...

  9. hdu6447 YJJ's Salesman

    这个题意和数据范围一看就是离散化之后树状数组优化DP.给的"从左下方走上去才能拿到收益"的性质其实可以当成"必须从横纵坐标严格比某个点小的地方转移过来".1A了 ...

  10. k序列和

    二分答案是参数搜索的一个改善.是这样,对于一个问题,如果它的答案具有单调性质(即如果i不可行,那么大于i的解都不可行,而小于i的解有可能可行),进而用二分的方法枚举答案,再判断答案是否可行,直到求到符 ...