Div充滿背景色作爲topbar

我試圖在中間顯示一個帶有標誌圖像的水平頂部條。圖像位於頁面左側，垂直位於中間。我將如何在頂欄的中心獲取圖像？這裏是我的代碼：Div充滿背景色作爲topbar

<div class='topbar'> 
     <img src="../../img/headerlogo.png" class="topbarlogo"/> 
    </div>

CSS：

div.topbar { 
    height: 80px; 
    width: 100%; 
    background-color: #000000; 
    margin-top: 0px; 

} 
.topbarlogo { 
    display: block; 
    position: absolute; 
}

來源

2013-01-13 Himanshu Yadav

的可能重複[父DIV不包括所有兒童（http://stackoverflow.com/questions/8424569/parent-div-doesnt-include-all-children） – Quentin

我們真的需要更多的代碼細節，比如什麼是topbar類，等等。沒有這些，我們不能給出一個肯定的答案。變量太多 – FrostyFire

爲什麼你的標誌有絕對的位置？除非父母div被定位，否則它將被定位爲相對於下一個定位的父母，我猜你的情況將是身體。你可以在'＃topbar'上添加'position：relative'來糾正這個錯誤，但我很好奇你爲什麼要這麼做。 – j08691

擺脫了.topbarlogo規則和簡單的爲您的DIV的text-align:center規則。

jsFiddle example

來源

2013-01-13 21:37:29 j08691

-2

你需要清除浮動。創建以下div如下：

<div style="clear:both;"></div>

應該這樣做。

來源

2013-01-13 21:26:06

這不會解決任何問題。 –

你在CSS中拼寫錯誤，'topbor'應該是topbar。

另外補充： -

margin-left: auto; 
margin-right: auto;

來源

2013-01-13 21:27:20

我猜這只是一個錯誤的帖子。 – j08691

很好的答案，+1。只是一個FYI，在一些CSS案例中，保證金汽車的東西不起作用，特別是在舊版瀏覽器中 – FrostyFire

好的一點。 –

Div充滿背景色作爲topbar

回答

相關問題