Div悬停在另一个Div上 - 高度/宽度

Question

我试图将一个div悬停在另一个满是内容的div上。这可以使用position：absolute和z-index来完成。问题是我希望悬停的div与div内容的高度和宽度相同。

我尝试了100％的高度和宽度，但自从我写道：

<div class=hover></div><div id=content>FULL OF CONTENT</div>

悬停div无法识别内容div的高度和宽度。

有什么建议吗？

Answer 1

将悬停的div 放在中的另一个div：

/* CSS */
#content {
  position: relative;
}
.hover {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

<div id="content">
  Content goes here.
  <div class="hover">
  </div>
</div>

悬停div可能只在内容上。如果在外部div上设置任何边框或边距，则悬停div不会覆盖它。