Question

这里有一个垒球CSS问题（希望如此）。

我正在寻找关于附加屏幕截图的一些CSS帮助。我有一个较大的盒子正确居中，但较小的盒子给我一些问题。

对于顶级小盒子，我最初尝试使用绝对定位，但是一旦浏览器调整大小，它就会粘住但是我的大盒子显然会移动，所以这不好。

底部的小盒子基本上需要坚持到底部。我打算用jQuery隐藏和显示它，所以它真的不应该打破内部任何文本的流动（我只是希望它出现在其他所有内容之上）。

真的，除了上面提到的内容之外，我没有任何限制，所以任何建议都会非常有用：）

alt text http://img812.imageshack.us/img812/3598/screenbg.png

编辑 - 这就是我目前所处的位置。

#container {
  width: 800px;
  margin: 0 auto;
  text-align: center;
}

Answer 1

我认为你走在正确的轨道上。如果您不关心框的分层/重叠，那么只需使用position: absolute表示小方框，position: relative表示大方框。后者可能是你缺少的钥匙，因为这会将小盒子固定在大盒子上。

更新

我不建议像其他一些用户那样使用负边距。 position: absolute的重点是使用属性right，top，bottom，left精确放置元素。如果您仅使用负边距移动一个绝对定位的元素，它仍将受文档顺序中的位置的支配。

例如，如果我在具有负边距的绝对定位元素之前放置了大量内容或更大的图像，则它将不再出现在同一位置。如果需要，那就太好了。但我根据原来的问题不相信。

Answer 2

您的（大）盒子是否有固定的高度/宽度？

无论如何，尝试将您的小盒子设置为绝对，但不要使用“left：20px; top：30px;”但是“margin-right：-50px; margin-top：-80px;”，这可能就是解决方案...

祝你好运！

Answer 3

使用z-index使底部div覆盖其他所有内容，并在需要时删除/隐藏它。这肯定是一个更好的CSS与“位置：绝对;保证金 - 顶部：-40px;保证金 - 左：20px;你也可以做保证金：-40px 20px 10px -3px;如果需要。一般来说，我我会劝你避免绝对定位或以不需要这种方法的方式设计你的页面。

帮助CSS div定位

3 个答案:

更新