下拉菜单显示不正确（父 div 有自动溢出）

Question

我正在处理一个项目，该站点具有灵活的值以适应任何分辨率。问题是在我的一个 div 中有一个下拉菜单，但它没有显示正确（被截断），因为父 div 有一个溢出自动它截断了 div 之外的部分。

div 需要自动溢出，因为它有边框和填充

基本代码

div.box{
    border:1px solid #ccc;
    overflow:auto;
    padding:10px;
}
.dd-btn{
    width:22px;
    height:22px;
    float:left;
    position:relative;
}
.dd-btn ul{
    list-style:none;
    width:100px;
    height:200px;
    position:absolute;
    top:22px;
    right:0;
    z-index:100;
    background:#000 
}
.dd-btn ul li{
    width:100px;
    float:left; 
}


<div class="box">
   <ul>
       <li>link</li>
       <li>link</li>
       <li>link</li>
   </ul>
</div>

由于整个网站的结构，这个 div 不能有浮动或宽度：100% 或高度。内容和分辨率会改变。

这个问题有简单的技巧吗？

找到解决办法：

.box:after{
    clear:both;
    content:" ";
    display:block;
    font-size:0;
    height:0;
    line-height:0;
    visibility:hidden;
    width:0;
}

使用这个我可以摆脱自动溢出，并且该框将正确显示

Answer 1

.menu_list {
  ...
  overflow: visible;
}

见http://www.w3schools.com/cssref/pr_pos_overflow.asp