2010-11-10 185 views
0

我正在開發一個網站linked here與3級下拉菜單(主和2個子級)。我正在用MODx cms和Wayfinder開發菜單。 這個CSS被挑選出來,經過了很多修改和工作,但我不明白1個細節。CSS多級下拉菜單定位

當你看到該網站的菜單:最右邊的主菜單項(「鏈接‘) - >鏈接1.2的’鏈接1.2」第二級子菜單很好地彈出來的左。在第一級子菜單(在打火機contentbody內部

的第二級子菜單定位在由一個「左:120像素(1項寬度):用於抵消它,它向右移動參見例如」 beeld & geluid 「 - >」音頻「 - >二級子菜單

對於這個最右邊的子菜單彈出內容它的作品通過使用負偏移將其左移Left:-240px;(這是寬度的項目)

我想念的是:爲什麼這個負偏移量必須是240px 2項目,而不是1項120px。最後是我的預期。

CSS包含註釋,涉及的行是155 -161在CSS文件中(您必須從網站獲取它作爲新用戶我無法添加第二個鏈接,因爲新用戶僅限於1最大鏈接)

問題:

任何人都可以解釋這一點嗎? 2的負偏移而不是1項?

最好的問候,

漢斯Troost

回答

2

會發生什麼事是,在第一個下拉菜單,列表項相對設置。然後第二個UL進入那裏,但被定位到絕對和物品的右側(在所有情況下都是右側)。但是,由於項目「鏈接」下方的子子菜單屬於網站,所以它位於左側-240像素。不是-120像素,因爲它會位於第一個子菜單的頂部。那有意義嗎?

-------------------------------------- 
Top item 1 | top item 2 | top item 3 | 
-------------------------------------- 
         | sub item 1 | 
      ---------------------------* * * * * * * 
      | subsubitem | sub item 2 | subsubmenu * <-- this is the ul that is positioned 
      ---------------------------* * * * * * *  absolute 
      -240px  -120px  0px   120px 

結論

所以我的觀點是,該UI被放置在同一個地方,但是李娜的移動到左邊。因此它需要-240px,因爲它相對於ul定位。

+0

非常感謝:正是我期待的那種答案。好解釋:我現在明白了。 – 2010-11-10 09:44:33