Question

我正在尝试在固定面板中添加绝对项目。我的HTML就像：

<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标签内有很多内容，我需要溢出行为来管理滚动效果。我已经尝试在li中添加相对位置，添加静态高度，宽度，最小宽度，最小高度......正如我在其他帖子中所做的那样但它没有解决我的问题。以下是代码：http://jsfiddle.net/jbval/SCzuu/

如果有人有想法。

感谢您的帮助。

JB

Answer 1

一个脏修复方法是将弹出类的位置设置为绝对，然后设置width和height属性，并溢出。

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

http://jsfiddle.net/zcKbd/

或者，如上一个答案中所述，将position: fixed;添加到弹出类中。

Answer 2

如何将popup修改为固定，请参阅下文。

.popup{ position:fixed; }

这是小提琴

http://jsfiddle.net/jm3Qh/

css绝对固定 - 溢出

2 个答案: