html - 如何让绝对位置 div 在文档调整大小时保持其位置

Question

我有一个带有以下 CSS 的 div

.menu{ 
    width:auto; 
    background-color:#FFF; 
    z-index:14; 
    position:absolute; 
    border:1px solid #d7d7d7; 
    border-bottom:2px solid #ccc;   
    display:none; 
    height:auto; 
    padding-top:2px; 
    padding-bottom:2px;  
}

当您单击所需元素时，我会根据所单击元素的左侧和顶部偏移来定位此 div。

当文档从顶部开始增加高度时，此 div 不会相应地改变其位置。这让它看起来很糟糕。

在这种情况下我如何保持它的位置

Answer 1

尝试用 div wrapper 包裹你的 .menu

html

<div class="mainWrap">
  <div class="menu"></div>
</div>

CSS

.mainWrap {
 position:relative;
}

.menu{ 
    width:auto; 
    background-color:#FFF; 
    z-index:14; 
    position:absolute; 
    border:1px solid #d7d7d7; 
    border-bottom:2px solid #ccc;   
    display:none; 
    height:auto; 
    padding-top:2px; 
    padding-bottom:2px;  
}