CSS菜單列表項需要顯示在div容器內

我使用這個下拉菜單：css-tricks simple jquery drop down，我需要它在另一個div內完全顯示。CSS菜單列表項需要顯示在div容器內

我的div是可拖動的$('#textbox')。你可以在jsfiddle中看到它：http://jsfiddle.net/asaakius/5nGYS/13/。我已經把相關的CSS放在這個jsfiddle中。

你會看到有一個可拖動的框，其中有一個x，這是可以翻轉的菜單。問題是菜單應該顯示裏面的文本框，但它不。我認爲這是因爲它溢出了右邊的$('#textbox')。這個菜單可以定位在左邊嗎？

我也在頁面的一側放置了一個平面x，而不是任何容器的一部分，因此您知道菜單在工作正常時的外觀。

2012-09-01 user961627

演示here。
以下是我所做的：
首先，可拖動內部的下拉菜單根本沒有顯示出來。我把下拉菜單ul放在li裏面有個「x」按鈕。然後，在ul.dropdown ul（在/* LEVEL TWO */之後）的CSS規則中，我將left: 0;更改爲right: 0;，並更改寬度以使其適合可拖動內部。
希望這有助於！
注意：如果您希望將下拉文本正確對齊，請將text-align: right;添加到ul.dropdown ul規則中。

來源

2012-09-01 11:03:07 Abraham

它確實有助於哉！感謝您的解釋！ – user961627

很高興幫助！ :) – Abraham

這裏是你的答案： http://jsfiddle.net/5nGYS/17/

來源

2012-09-01 11:11:12

隨着你的小提琴，菜單出來，而我的和亞伯拉罕的，他們在文本框內，這樣，當它的大小和縮小，部分菜單被隱藏，我不想。你用什麼CSS的部分讓菜單停留在文本框之上？ – user961627

這是關於位置相對和絕對結合左，上和右。這是爲了定位。菜單保留在文本框的頂部，因爲它具有更高的Z-index –

CSS菜單列表項需要顯示在div容器內

回答

相關問題