固定的CSS絕對 - 溢出

我試圖在固定面板內添加絕對項目。我的HTML是這樣的：固定的CSS絕對 - 溢出

<ul> 
<li><a href="#">test</a> 
<div class="popup">Popup</div> 
</li> 
</ul>

的CSS：

ul 
{ 
position:fixed; 
left:10px; 
top:0; 
min-height:100%; 
width:80px; 
overflow:hidden; 
background-color:#ccc; 
color:#fff; 
z-index:0; 
} 
ul li 
{ 
position:relative; 
} 

.popup 
{ 
width:400px; 
border:1px solid #000; 
display:none; 
position:absolute; 
color:#000; 
z-index:1001; 
}

我的問題是溢出的行爲。如果我禁用溢出彈出窗口工作良好，但即使在絕對位置彈出窗口被隱藏。如果我的ul標籤中有很多內容，我需要溢出行爲來管理滾動效果。我已經嘗試添加相對位置的李，添加靜態高度，寬度，最小寬度，最小高度......因爲我在其他帖子，但它並沒有解決我的問題。這裏是代碼：http://jsfiddle.net/jbval/SCzuu/

如果有人有一個想法。

感謝您的幫助。

來源

2013-04-04 jbb

髒修復將作出彈出類絕對位置，然後設置寬度和高度屬性，和溢出。

position:absolute; 
width:400px; 
height:400px; 
overflow:auto;

http://jsfiddle.net/zcKbd/

或者，如前面的回答說，加入position: fixed;在彈出類。

來源

2013-04-04 10:04:14 Mido

感謝您的回答。第一個解決方案並不適合我，因爲我需要固定而不是靜態的ul項。第二個似乎更好，將彈出窗口定義爲固定的，我會試試這個。 – jbb 2013-04-04 11:16:31

如何使popup也爲固定，見下文。

.popup{ position:fixed; }

這裏的撥弄

http://jsfiddle.net/jm3Qh/

來源

2013-04-04 10:00:57 GeekyCoder

謝謝，正如Mido說它可能是一個解決方案，我會嘗試是否有任何副作用。 – jbb 2013-04-04 11:19:13

很高興有幫助。那麼你可以考慮提高答案，因爲這可能對其他人有利。 – GeekyCoder 2013-04-04 11:58:27

我喜歡upvoting，但似乎我還沒有足夠的聲望尚未投票。 – jbb 2013-04-09 12:09:54

固定的CSS絕對 - 溢出

回答

相關問題