ie6 ie7下,Li不能自动换行,出现竖排文字现象(PS:li不固定宽度,所有li同一行显示),在ie8却可以
好久没写CSS,今天又发现一个ie兼容问题。
我需要所有的li在同一行显示,不固定Li的宽度,如果一行排不下,需要自动换行。当然Li的内容长度不同。
必须在li加white-space:nowrap;
如果没加这句,IE6和IE7会乱掉(如图1),IE8是好的(如图2)
(图1)
(图2)
<style>
*{padding:0;margin:0;}
ul,li{list-style:none;}
.list{padding:100px;background:#e4e8da;height:300px;width:300px;}
.list li{float:left;margin:5px 10px;font-size:14px;font-family:"微软雅黑";color:#7ec052;}
</style>
<ul class="list">
<li>除尘器布袋</li>
<li>除尘器骨架</li>
<li>电磁脉冲阀</li>
<li>脉冲控制仪</li>
<li>星型卸料器</li>
<li>卡箍</li>
<li>脉冲阀膜片</li>
<li>吊帽</li>
<li> 除尘器花板</li>
<li>气缸</li>
<li>骨架口底</li>
<li>文氏管</li>
<li>通风蝶阀</li>
<li>布袋/滤袋清洗</li>
</ul>
ie6 ie7下,Li不能自动换行,出现竖排文字现象(PS:li不固定宽度,所有li同一行显示),在ie8却可以的更多相关文章
- 一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行
一句white-space:nowrap解决IE6,IE7下浮动元素不自动换行
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- IE6/IE7下:inline-block解决方案
IE6/IE7下对display:inline-block的支持性不好. 1.inline元素的display属性设置为inline-block时,所有的浏览器都支持: 2.block元素的displ ...
- ie6,ie7下设置overflow:auto下滚动条不起作用
今天遇到一个比较特殊的情况:ie6,ie7下设置overflow:auto下滚动条出来了但是滚动条不起任何作用,但在火狐,ie8,ie9,谷歌等浏览器下正常显示,解决方案:只需要加一个position ...
- 空a标签 a标签空的情况下 IE6 IE7下点击无效
最近做了好多网站专题页面,因为专题页面图片较多,个别banner上有1个到多个按钮,一种是用“图解img标签的usemap”的方法做链接,(图解img标签的usemap使用方法)[传送门] 另一种用则 ...
- IE6/IE7下:inline-block不兼容的问题
IE6/IE7下对display:inline-block的支持性不好. 1.inline元素的display属性设置为inline-block时,所有的浏览器都支持: 2.block元素 ...
- IE6 IE7下li间距、高度不一致问题(转)
http://www.phpddt.com/dhtml/926.html 问题描述:li的高度在IE6 IE7间距高度和其他浏览器不一致,即便设定了高度,IE6,7中,仍比其他浏览器要高. 解决方法: ...
- IE6/IE7下绝对定位position:absolute和margin的冲突问题解决
首先我们来看一个代码: 复制代码代码如下:<div id=”layer1″ style=”margin:20px; border:1px solid #F88; width:400px; “&g ...
- JavaScript在IE6,IE7下报错'expected identifier, string or number'
问题: 代码在Forefox和IE8下工作正常,但是在IE6下报错: expected identifier, string or number 假如变量options有多个选项,那么我们可以用逗号分 ...
随机推荐
- Framework7 下拉刷新
html结构 <div class="page"> <!-- Page content should have additional "pull-to- ...
- 面向视频的全新AI架构 —— 阿里云智能视觉技术全解
我们都知道,AI技术正在以可见的速度被应用于各行各业,然而绝大部分业务场景想应用AI技术,都需要算法工程师根据自身业务的标注数据,来进行单独训练,才能打磨出合适的AI模型.如此一来,如何以最低的门槛和 ...
- mysql中bigint、int、mediumint、smallint与tinyint的取值范围
https://blog.csdn.net/github_39110707/article/details/74277381 mysql数据库设计,其中对性能优化,字段类型很重要,下面对bigint. ...
- 解决/home磁盘空间不足问题
最近在Linux下做仿真实验,但是渐渐的发现,/home原来分配的空间不足.通过先建硬盘分区,然后挂载到/home文件的方法,在网上查了好多资料 建立分区并挂载分区http://www.se126.c ...
- Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第三章:变换
原文:Introduction to 3D Game Programming with DirectX 12 学习笔记之 --- 第三章:变换 学习目标 理解如何用矩阵表示线性变换和仿射变换: 学习在 ...
- js、php判断手机PC
用于phpcms <script type="text/javascript"> var url = window.location.href; if(/Android ...
- Vue知识点——vue数据深拷贝方法
背景 在vue页面传递数据的过程中,传递数据的引用地址并不会改变,所以当我们改变一些数据时,数据源 也会随之改变.可是有很多情景,我们改变传递的数据,并不需要源数据值发生变化,这时我们就需要对数据进行 ...
- 利用IDEA构建springboot应用-配置文件
application.properties配置文件(不建议采用这种配置) 配置文件采用:application.yml文件会更简便,要带空格 属性配置与类中取值 添加bean属性配置到一个类里面,采 ...
- Spring Data JPA 查询结果返回至自定义实体
本人在实际工作中使用Spring Data Jpa框架时,一般查询结果只返回对应的Entity实体.但有时根据实际业务,需要进行一些较复杂的查询,比较棘手.虽然在框架上我们可以使用@Query注解执行 ...
- oracle函数 to_single_byte(c1)
[功能]将字符串中的全角转化为半角 [参数]c1,字符型 [返回]字符串 [示例] SQL> select to_multi_byte('高A') text from dual; test -- ...