【转自:】 http://blog.csdn.net/sd2131512/article/details/4720345

按照常理,对于某一单元行需要显示时,使用:display:block属性,不需要显示时使用display:none属性,而且这样做在IE浏览器中显示正常,没有任何问题。

但是当用Firefox浏览时却出现了布局错乱的问题,然后通FireBug去看了下源码,调试下了,发现是display:block属性搞的鬼。

1、当表格为多列的情况下,属性为"display:block"行的内容宽度仅与第一列宽度相同,也就是说无论你使colspan的属性值为多少,剩余列的空间都不进行解析。
2、同一行反复的在"display:none;"与"display:block;"两个状态间切换时,表格的底部会持续的产生多余的空白空间以至于造成页面布局的扭曲。

解决方法:
1、用display:table-row属性来调试,发现者FireFox下正常了,但IE是不支持改属性的,怎么办呢?用JS来做判断,然后做兼容吧。
2、另外一个很简单也很可行的方法,就是用 display:' ' 这个属性dispaly后面不加任何的东西,很奇怪,这样就兼容了Firefox和IE了。

在table中tr的display:block在firefox下显示布局错乱问题的更多相关文章

  1. table中tr的display属性在火狐中显示不正常,IE中显示正常

    最近在作项目的时候碰到一个问题,就是需要AJAX来交互显示<tr> </tr> 标签内的东西,按照常理,对于某一单元行需要显示时,使用:display:block属性,不需要显 ...

  2. ie、firefox、chrome中关于style="display:block" 引发的页面布局错乱的解决办法

    ie.firefox.chrome中关于style="display:block" 引发的页面布局错乱的解决办法: table中tr 添加style="display:b ...

  3. table中tr使用toggle不好,选择换一张方式

    好几次遇到的问题,都是table中tr后面有一部分内容要显示,也是用tr装的,但是需要点击该行,后面那个tr才显示出来.不过最好不要用toggle去写,因为着实效果不佳.故而建议换一种方式,也许最简单 ...

  4. 如何改变vim中的光标形状 : 在插入状态下显示为 beam?而在 其他 状态下 为 block?

    分成两种情况来说明: 如果是在 shell 即: gnome-termial终端中, 来启动或 使用 vim的话, 你是 无法 实现这种需求的: 改变vim中的光标形状 : 在插入状态下显示为 bea ...

  5. 对table的tr使用display:block显示colspan失效问题的解决

    qqqq <table> <tr> <td id="qqq" colspan="3" style="display:no ...

  6. 有关table布局时tr 属性display:block显示布局错乱

    display:block display:block是可以把非块级元素强制转换为块级元素显示,如内嵌元素span,原来不支持设置宽高,宽度是由内容撑开的; display:table-row tab ...

  7. table中tr间距的设定table合并单元格 colspan(跨列)和rowspan(跨行)

    table中的tr的默认display:table-row,虽然可以修改为display:block但是就失去了tr特有的显示效果,如(td自动对齐): 并且在tr中对起设定padding是有用的,可 ...

  8. js的传值,table中tr的遍历,js中动态创建数组

    1.这里关键是对页面中的传值,其次是动态的创建一个数组,用来存值 $(val).css("background-color", "rgb(251, 248, 233)&q ...

  9. javascript闭包获取table中tr的索引 分类: JavaScript 2015-05-04 15:10 793人阅读 评论(0) 收藏

    使用javascript闭包获取table标签中tr的索引 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...

随机推荐

  1. 2018年全国多校算法寒假训练营练习比赛(第四场)F:Call to your teacher

    传送门:https://www.nowcoder.net/acm/contest/76/F 题目描述 从实验室出来后,你忽然发现你居然把自己的电脑落在了实验室里,但是实验室的老师已经把大门锁上了.更糟 ...

  2. python3与python2的区别(目前遇到的)

    1.进击的print,变成一个函数,print() 2.urllib大一统,呵呵 3.python3默认绝对路径导入

  3. XFF的学习+修改源码--Are you in class

    这几天有做天枢CTF的“Are you in class”的题目,虽然以前了解过XFF,但还是没有很好地应用,而且最后居然掉进了一个大坑,且听我细细讲来.   打开题目,首先有个提示“在不在学校主要看 ...

  4. 前端框架(kraken、Express、Node、MVC)

    You know my loneliness is only kept for you, my sweet songs are only sang for you. 前端框架相关知识记录. krake ...

  5. [转]Docker到底是什么?为什么它这么火?

    如果你是数据中心或云计算IT圈子的人,这一年多来应该一直在听到普通的容器.尤其是Docker,关于它们的新闻从未间断过.Docker1.0在今年6月发布后,声势更是达到了前所未有的程度. 动静之所以这 ...

  6. SpringBoot08 请求方式、参数获取注解、参数验证、前后台属性名不一致问题、自定义参数验证注解、BeanUtils的使用

    1 请求方式 在定义一个Rest接口时通常会利用GET.POST.PUT.DELETE来实现数据的增删改查:这几种方式有的需要传递参数,后台开发人员必须对接收到的参数进行参数验证来确保程序的健壮性 1 ...

  7. SQLServer BI 学习笔记

    MSBI 学习库: https://ask.hellobi.com/blog/biwork SSAS库部署的几种方式 http://www.cnblogs.com/aspnetx/archive/20 ...

  8. 将tomcat做成windows服务

    @参考文章 大致步骤: 1,配置环境变量(选读) 2,安装 3,卸载(选读) 配置环境变量: 这块不是必须的.我不喜欢给tomcat配置环境变量,默认即可.如需要配置可看参考文章,也可参考我之前的文章 ...

  9. SAP transportation

    1.CONFIGURATION TRANSPORT flow:DEV(100) --scc1--> DEV(400) --STMS after release-> QAS(510) --S ...

  10. MongoDB的索引(六)

    数据准备:在mongodb命令行终端执行如下代码 for(var i=0;i<100000;i++) { ... db.users.insert({username:"user&quo ...