css - 使两个 div 漂浮在另一个的 Angular 落上

Question

这是我需要的。我将有一个主要的 div，其中将包含我的大部分内容。我不知道会有多少内容，所以我不能对主 div 的高度(比方说，以像素为单位)做任何假设。我需要做的是让两个 div(具有一定的固定大小)位于主 div 的左上角(当然，z-index 大于主 div)和右下角同一个分区。我真的不知道如何实现这一目标:谁能告诉我该怎么做？？

非常感谢!

马特奥

Answer 1

所有你需要做的就是将主 div 位置设置为 relative 并将你的两个“Angular ”覆盖绝对，一个顶部和左侧 0，另一个底部和右侧 0。如果你必须重叠 Angular ，你'必须使用负值(例如顶部:-5px；左侧:-5px；)。

/* The required CSS rules */
#container {
  position:relative;
}

.tl,.br {
  position:absolute;
}

.tl {
  left:0;
  top:0;
}

.br {
  right:0;
  bottom:0;
}

这里是 HTML 代码:

<div id="container">
  <div class="tl"></div>
  <div class="br"></div>
</div>

看看here .