在純css下拉菜單中解決問題

我最近使用Google教程創建了一個純CSS的下拉菜單。在純css下拉菜單中解決問題

我雖然有一個問題：

如果我給一個小幅度的2級ul，當你將鼠標懸停在ul和家長li下拉之間的差距消失。

有什麼辦法解決這個不涉及Javascript？

2012-09-17 Nojan

該邊距導致鼠標放棄「鼠標懸停」狀態，沒有它，它工作正常。

如果您切換到padding-top:.5em;它應該按預期工作。這是因爲保證金位於塊元素的外部，而填充位於內部。

2012-09-17 12:52:53 JKirchartz

感謝您的指導。但我認爲這很奇怪。因爲元素外部的邊距仍然在父元素內部。所以當我們在邊緣區域徘徊時，我們沒有徘徊父元素。你有什麼想法嗎？ – Nojan

這是所有的盒子模型怪異，檢查了這一點http://dev.opera.com/articles/view/30-the-css-layout-model-boxes-border/ – JKirchartz

使用padding-top，而不是margin-top。

2012-09-17 12:51:53 DanielB

http://jsfiddle.net/ba76n/9/更新你的小提琴......希望它有助於:)

（只是刪除從下拉李緣頂部，並添加一個邊框）

2012-09-17 12:54:15 OctoD

使用padding-top，而不是因爲保證金margin-top應用之外該塊所以當你嘗試選擇子菜單它的邊緣和塊被改變，所以子菜單消失

2012-09-17 12:56:01

回答