css 固定位置在包装器的顶部？

Question

我有一个位于中间居中的#wrapper { margin: 0 auto }。 我想在该包装器的右上角(该包装器)的右上角对齐 div.version 。因此 .version div 仍应位于 #wrapper 内部。

我必须在这里使用哪个位置值？

Answer 1

您可以为您的 div 使用绝对 和相对 定位，如下所示:

#wrapper {
 margin: 0 auto;
 position:relative;
 width:400px;
 background:green;
 clear:both;
 overflow:auto;
 height:100px;
}

.version {
  position:absolute;
  top:0;
  right:0;
  background:blue;
  height:100px;
  width:50px;
}

Check out the DEMO

因此，要使一个元素出现在另一个元素内部，您应该将父元素的位置设置为relative，而将任何子元素的位置设置为absolute:)

查看 css-tricks.com 上有关该主题的精彩文章:

• Absolute Positioning Inside Relative Positioning