CSS沒有得到的Chrome瀏覽器

我有以下線正確的應用在我的JSPXCSS沒有得到的Chrome瀏覽器

<div class="page_nav"> 
    <a id="saveButton" class="button"><span>${save}</span></a>   
    <a id="cancelButton" class="button"><span>${cancel}</span></a> 
</div>

裝載「保存」和「取消」按鈕。當我加載頁面時，按鈕的順序不是排序的，只能在chrome中排序。請參閱參考截屏

BUTTON NOT DISPLAYED ORDERLY

下面是CSS複製粘貼

a.button { 
    background: transparent 
     url('../../images/admin/bg_button_span.png') repeat 
     scroll top right; 
    color: #fff; 
    display: block; 
    float: left; 
    font: normal 1.1em Tahoma, Arial; 
    height: 24px; 
    margin-right: 6px; 
    padding-right: 10px; 
    padding-left: 10px; 
    text-decoration: none; 
    cursor: pointer; 
} 

.page_nav { 
    float: left; 
    margin: 1em 0; 
    width: 100%; 
    clear: both; 
}

這隻發生鉻

我用的是同一個div中另一個頁面（同樣的類名），它完美的工作。不知道什麼是缺少在這裏

請幫我在這

來源

2013-03-21 Arun

嘗試設置溢出：隱藏.page_nav：

.page_nav { 
    float: left; 
    display:block; 
    margin: 1em 0; 
    width: 100%; 
    overflow: hidden; 
}

來源

2013-03-21 14:53:52 Lowkase

謝謝!!它適用於所有瀏覽器！ :-) – Arun 2013-03-21 15:01:31

@Lowkase你能解釋一下問題的原因以及溢出的方式：隱藏屬性解決了這個問題。它會幫助其他讀者。謝謝！！ – sachinjain024 2013-03-22 13:04:16

OP沒有正確清除.page_nav的浮動子項。我只是使用overflow清除了.page_nav的子浮點數：hidden。我更喜歡使用溢出來清除我的浮動，除非在某些情況下我必須使用clearfix。你可以在這裏閱讀更多關於清理漂浮物的信息：http://www.impressivewebs.com/clearing-floats-why-necessary/ – Lowkase 2013-03-22 13:18:43

CSS沒有得到的Chrome瀏覽器

回答

相關問題