java 雞婆的合併tag 造成css 或 script 相容性上的問題

前陣子做的好 google map, 如下圖, 系統分析師今天反應有一個 block 消失了, 我檢查一下 html 元素, 真的被蓋過去了.

說明: 右上方有一個透明的橘色區塊, 被 google map 蓋過去.


我先挑戰在這個 block 增加 css style="clear:both;" 一樣無解, 只好求助UI設計大師 Anita, 調了很久也弄不出所以然, 最後 Anita 發現問題在這一個 block 被包含在 google map 的 div tag 裡, 終於找到發生的原因就是 JSP 在處理 xsl 時, 把

合併成一個

所以造成的錯誤, 結論就是在 div 裡增加   讓 div 不會雞婆的自動被合併, xsl 程式碼如下:

如果, 不增加   的話, 產生出來的 html 如下:
<div style="width:100%;" id="map_canvas" class="mapimg" />

由於不是第1次 遇到, 之前也有因為 tag 被合併後, div 吃不到 css 的 class 的情況, 所以這次比較快就解決了, 解決後正常的畫面如下:

說明: 被蓋住的 block 就秀出來了, 感動...