相對div內元素之間的css空間

我有這兩個div。我希望鏈接出現在頂部div的底部。它的作品，但我離不開要素之間的任何空間元素

結果之間

#top{background:white; 
height:200px; 
text-decoration:none; 
position:relative; 
} 

#menu a{text-decoration:none; 
position:absolute; 
bottom:0; 
margin-left:10px; 
    }

http://jsfiddle.net/h7x4zvf4/添加空間。我可以理解，使用相對位置會影響其他定位，例如填充和邊距，但沒有找到原因。

來源

2015-05-26 Andrewboy

他們都是在同一個地點。不要使用絕對定位或改變其位置（頂部/右側/底部/左側） – j08691

通過使用

#menu a { 
    position:absolute; 
}

你的正常流動單獨所以margin-left刪除每個<a>沒有效果，因爲沒有什麼每個元素的左邊（或任何其他方向），可以影響這些元素的位置。

從#menu a卸下position:absolute並將其添加到你的#menu，這樣你在你的div#top而內側元件定位「正常」，即相對於彼此的底部包含所有錨的元件進行定位。

#menu { 
    position:absolute; 
    bottom:0; 
} 
#menu a { 
    text-decoration:none; 
    margin-left:10px; 
}

Fiddle

來源

2015-05-26 20:00:47 mmgross

感謝你的解決方案，其作品如我所料。是底部：0;通過#menu a？如果我刪除仍然有效 – Andrewboy

不，'bottom：0;'不是'#menu a'所必需的，我將它留在那裏是意外，更新我的答案以將其刪除。 – mmgross

對不起，我不能給你添加更多的分數謝謝你很詳細的答案！ – Andrewboy

沒有必要使用此定位 - 只要給你的#top一個margin-top，像這樣;

#top { 
    margin-top: 200px; 
} 


#menu a { 
    margin-left:10px; 
}

Fiddle

來源

2015-05-26 20:00:20

我總是覺得重複的值（如本例中的'200px'）是一個壞主意，因爲如果你決定改變高度容器中你將有更多的工作來調整所有的值。這可能只是我個人的感受，但它讓我想起了硬編碼的東西，不應該硬編碼 – mmgross

對不起，但我需要練習使用相對和絕對stufss，即使它是我現在不能使用的作品。但謝謝你你的努力 – Andrewboy

相對div內元素之間的css空間

回答

相關問題