浮動元素的問題在Firefox

Question

我有我的h1和floating元素的問題

我想​​h1元素在我的presentation文字的右側對齊。

Chrome顯示效果不錯，但不是firefox ..​​文本在我的一張幻燈片圖像中。

這裏是我的jsfiddle

http://jsfiddle.net/A3RXg/3/

有人能幫助我嗎？

Thansk

Answer 1

沒過的jsfiddle這裏：http://jsfiddle.net/89dQr/。

更新CSS代碼

#page-count{ 
    float: right; 
} 

.break { 
    clear: both; 
} 

h1{ 
    float: left; 
} 

Answer 2

嘗試刪除

white-space: nowrap;

從CSS的

#slide-container

DEMO FIDDLE

Answer 3

如果你打算使用「section」標籤，你需要指定一個寬度。否則，我會建議使用DIV標籤。我相信你的iissue是段標籤沒有寬度，並且不會根據內容重新調整大小。

請參閱「how to float the section tags in html5」瞭解有關float +章節標籤的信息。

Answer 4

你根本就換你的H1

<div style="float:left; width:300px;"> 
    <h1>Presentation</h1> 
</div> 
<div style="float:left"> 
    <h1 >page number</h1> 
</div> 
<div style="clear:both"></div> 

Answer 5

火狐拒絕具有相同父元素之下存在非浮動元素內聯顯示浮動元素。 （火狐始終使用display:block;爲浮動的元素。）

要麼父元素上使用position:relative;和使用絕對定位爲h1 S，或浮動兩者「演示」和「頁碼」。