2011-06-28 9 views
0

我有一個論壇標題欄(有論壇名稱和主題標題)。論壇名稱,只要在:hover上被剪切並顯示。目標是讓主題標題在論壇名稱旁邊開始,不論是否懸停,也會在時間過長時剪輯。Opera特有的佈局問題(浮點數)

以下reduced test case適用於Chrome和FF,但不適用於Opera(在11.50 alpha上測試,最新穩定,均在mac上)。

正確行爲:主題標題(紅色輪廓標題)與論壇名稱一致。

我在Opera得到什麼:文本消失了 - 實際上是由overflow:hidden.nav_bar隱藏,它被移到下一行。

回答

5

display: inline-block; float: left是不合邏輯的,因爲float: left forces display: block

由於您使用了white-space: nowrap,我打算保留display: inline-block並刪除float: left

這就使我們在這裏:http://jsfiddle.net/wkA7q/4/

它現在始終可見,但文本不是在大多數瀏覽器對齊。

爲了解決這個問題,添加vertical-align: top幾次:http://jsfiddle.net/wkA7q/5/

這一工程,是瀏覽器,火狐,歌劇,IE9/8之間是一致的。

(我知道,我真的不解決的原因歌劇不同的顯示這裏。雖然display: inline-block; float: left與對方發生衝突,結果被很好地定義。)

+0

非常感謝。這個問題讓我感到很沮喪。 – Litek