Html 溢出自动和可见的混合行为

我有HTML结构

<div class="PapaDiv">
  <input type="checkbox"/>
  <label></label>
  <div class="ChildDiv">
    <input type="radio"/><label></label>
    <input type="radio"/><label></label>
    <input type="radio"/><label></label>
  </div>
  <br/>
</div>

编辑：没有显示的原因是CSS中有

display:none

。这涉及到JavaScript。对于这些元素，在复选框或其标签上的鼠标悬停处，将显示ChildDiv（

jQuery$（'.ChildDiv'）.show（）

）

---

从ChildDiv或PapaDiv中移出鼠标时：

$（'.ChildDiv'）.hide（）

。此外，还有一个简单的计算，用于设置ChildDiv的“top”和“left”属性，使其显示在复选框旁边。ChildDiv已定义为

位置：绝对
我在迪姆斯基之前也遇到过同样的问题。当鼠标悬停在图像上方时，我正试图创建一个出现在图像上方的放大镜。我发现父div，在本例中是
#PapaDiv
必须相对定位，而子div，在本例中是
#ChildDiv
绝对定位

我知道
#PapaDiv
的父元素的位置是相对的，但是如果我记得的话，我必须相对地定位子元素的直接父元素

试试这个：

#PapaDiv{
位置：相对位置；
}
#儿童课{
位置：绝对位置；
}

当然，您也可以在其中添加所有其他附加CSS

下面的链接是我用来帮助我的帖子：

我以前也有过同样的问题。当鼠标悬停在图像上方时，我正试图创建一个出现在图像上方的放大镜。我发现父div，在本例中是
#PapaDiv
必须相对定位，而子div，在本例中是
#ChildDiv
绝对定位

我知道
#PapaDiv
的父元素的位置是相对的，但是如果我记得的话，我必须相对地定位子元素的直接父元素

试试这个：

#PapaDiv{
位置：相对位置；
}
#儿童课{
位置：绝对位置；
}

当然，您也可以在其中添加所有其他附加CSS

下面的链接是我用来帮助我的帖子：

如果您能添加一些css，那将非常有帮助：P@Dimskiy，如果此代码按原样呈现（例如使用jsfiddle:），则不会显示任何内容。我怀疑您的代码使用了相当多的Javascript来显示任何内容——除非您向我们展示该代码，否则很难想象您的问题需要如何解决。可能是JS的东西，可能是CSS的东西，但我们需要知道！如果您添加一些css，这将非常有帮助：P@Dimskiy，如果此代码按原样呈现（例如使用jsfiddle:），则不会显示任何内容。我怀疑您的代码使用了相当多的Javascript来显示任何内容——除非您向我们展示该代码，否则很难想象您的问题需要如何解决。可能是JS的东西，可能是CSS的东西，但我们需要知道！
.ChildDiv{
    background-color: #EDF1F9;
    border: 1px solid #557AB5;
    display: none;
    max-height: 200px;
    overflow-y: auto;
    padding: 10px;
    position: absolute;
}

.PapaDiv{
    background-color: #FFFFFF;
    border: 1px solid #557AB5;
    box-shadow: 3px 3px 7px rgba(0, 0, 0, 0.3);
    left: 0;
    max-height: 300px;
    overflow-y: auto;
    padding: 0.5em;
    position: absolute;
    top: 0;
    width: 98%;
    z-index: 501;
}

PapaDiv's parent div {
    position: relative;
    width: 100%;
}