簡單的CSS樣式 - 定位div的

這是一個關於CSS的非常簡單的問題。我想在圖片中描繪的風格，我想這樣的代碼：

#parent { 
    overflow: hidden; 
text-align:center; 
} 
.navbar { 
position:absolute; 
top:0px; 
right:3px; 
} 
.logo { 
float:left; 
} 
.table { 
float:left; 
}

，但它不爲我工作，我得到這個： not this!

來源

2012-07-18 Lorenzo Comoglio

嘗試：

#parent { 
overflow: hidden; 
text-align:center; 
margin:auto; 
width:80%; 
} 
.navbar { 
position:absolute; 
top:0px; 
right:3px; 
} 
.logo { 
float:left; 
} 
.table { 
float:left; 
}

爲了達到你想要的效果，你需要使用margin:auto來居中父母分隔符，並使用width:80%來放置一個流體寬度。

來源

2012-07-18 19:59:45

你好，這是工作的表和標誌，但導航欄不符合表。 – 2012-07-18 20:02:55

您將需要顯示一些HTML。 – 2012-07-18 20:05:28

我用body {margin：0 0 0 0; }，謝謝你的幫助！ – 2012-07-18 20:12:49

我給你的父元素一個明確的寬度，然後是位置從那裏：

#parent { 
    width: 960px; 
    margin: 0 auto; 
    position: relative; 
} 

.navbar { 
    position: absolute; 
    top: 0; 
    right: 3px; 
} 

.logo { 
    margin-bottom: 20px; 
    display: inline-block; 
} 

.table { 
    width: 100%; 
}

我不知道你在網頁上有什麼其他的內容，但你的.logo元素應該出現你想要使用默認的HTML流程。如果表格是100％，則會清除。你應該能夠在沒有浮動的情況下將其關閉。

來源

2012-07-18 20:03:55 chipcullen

簡單的CSS樣式 - 定位div的

回答

相關問題