在table中tr的display:block顯示佈局錯亂問題

最近在作項目的時候碰到一個問題，就是需要AJAX來交互顯示<tr></tr>標籤內的東西，按照常理，對於某一單元行需要顯示時，使用：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了。具體原因有待牛人分析。

文章轉載於：http://blog.sina.com.cn/s/blog_5b6c4f550100yk4x.html