我有以下帶有關聯上下文菜單的按鈕 <div class="control-action"> <button>Action</button> <ul style="display:none"> <li class="action-remove">Remove</li> <li class="action-detail">Detail</li> <li class="action-assigned">Assign</li> </ul> </div> 單擊該按鈕時，關聯的內容ul在其下方顯示為上下文菜單。在IE 7以外的所有瀏覽器上，此功能都非常有效。在IE7中，上下文菜單（ul）顯示在其下方的按鈕下方。我想這可能是由于堆棧上下文如何解析這些元素。我的CSS目前看起來像這樣：.control-action{ position: relative; text-align:right; width:100px; }.control-action ul{ position:absolute; z-index: 10000; list-style:none;}關于我在做什么錯的任何想法嗎？
3 回答
慕田峪9158850
TA貢獻1794條經驗 獲得超7個贊
我已經通過更改元素順序解決了這一問題。我已經從同時包含按鈕和菜單中刪除了相對位置元素，并使其僅成為菜單的父元素。
<div class="control-action" style="float:right">
<div class="control-action-menu">
<ul style="display:none">
<li class="action-remove">Remove</li>
<li class="action-detail">Detail</li>
<li class="action-assigned">Assign</li>
</ul>
</div>
<button>Action</button>
</div>
通過此標記更改，css已更改為以下內容：
.control-action
{
text-align:right;
width:100px;
}
.control-action-menu
{
position:relative;
z-index:1;
}
.control-action ul
{
position:absolute;
z-index: 10000;
list-style:none;
}
- 3 回答
- 0 關注
- 506 瀏覽
相關問題推薦
添加回答
舉報
0/150
提交
取消