【转自:】 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. ACM-ICPC 2018 沈阳赛区网络预赛 F. Fantastic Graph (贪心或有源汇上下界网络流)

    "Oh, There is a bipartite graph.""Make it Fantastic."X wants to check whether a ...

  2. 细说SVN集中式版本控制器

    svn全称Subversion,实现多人开发同一个项目时,对源代码进行管理的工具.在公司里边,一个项目是由多人同时在开发,大家在本地自己电脑开发php代码,完毕后就commit上传给服务器运行.  如 ...

  3. jQuery和js使用点滴

    1.checkbox全选按钮 <input type="checkbox" name="allcheck" id="allcheck" ...

  4. os模块。笔记

    os 模块提供了很多允许你的程序与操作系统直接交互的功能 得到当前工作目录,即当前Python脚本工作的目录路径: os.getcwd() 返回指定目录下的所有文件和目录名:os.listdir()  ...

  5. Sqlite文件在ubunut的查看

    1. How to list the tables in a SQLite database file that was opened with ATTACH? The .tables, and .s ...

  6. hangfire enqueued but not processing(hangfire 定时任务入队列但不执行)

    不生效的方法 //RecurringJob.AddOrUpdate<FamilyAppService>((s) => s.UpdateFamilyLevel(), input.Cro ...

  7. IIS7中的站点、应用程序和虚拟目录详细介绍

    IIS7中的站点.应用程序和虚拟目录详细介绍 这里说的不是如何解决路径重写或者如何配置的问题,而是阐述一下站点(site),应用程序(application)和虚拟目录 (virtual direct ...

  8. JoyOI1940 创世纪

    一道基环树+树形\(DP\) 原题链接 显然输入的是内向基环树森林,且我们可以单独考虑每一棵基环树. 既然是基环树,自然先\(dfs\)找环,然后随便找环上的一点\(r\),将其与\(A[r]\)的边 ...

  9. 可迭代对象(Iterable)和迭代器(Iterator)

     迭代是访问集合元素的一种方式. 迭代器是一个可以记住遍历的位置的对象. 迭代器对象从集合的第一 个元素开始访问,直到所有的元素被访问完结束.迭代器只能往前不会后退. 1. 可迭代对象 以直接作用于 ...

  10. mysql 多表查询先排序,然后再取分组<mysql 先order by,然后再取group by分组>

    select * from ( select cv.lasttime,cm.mailbox,cv.clientip from `co_user_visitlog` as cv INNER JOIN ` ...