CSS 定位相对于固定/绝对

如果我对 CSS 显得很“菜鸟”，请见谅。我一直在尝试设置以下...

#0 {
 width: 100%;
 height: y;
 border: 1px solid black;
}   
#a {
 position: fixed;
 float left;
 width: x;
 height: y;
 border: 1px solid black;
}
#b {
 position: relative;
 float: left;
 width: x;
 height: y;
 border-right: 1px solid black;
}

/* HTML */
<div id="0">Some div...</div>
<div id="a">Another div</div>
<div id="b">Final div...</div>

出于某种原因，如果我尝试将 #b 定位在 #a 下面，#b 将出现在 #a 之上，除非我将其位置声明为静态或绝对，但随后需要手动定位顶部/左侧属性，并且这也不能在所有浏览器上正确显示。任何帮助将不胜感激！

现在已经修好了！ （必须声明 html，body:( width: 95%;)）感谢所有建议！

首先，有几个修复： #0 需要命名为其他名称，因为 ID 不能以数字开头。您还缺少 #a 的 float 属性中的 : 。也不知道高度/宽度的“x”和“y”是什么 - 我认为这些只是示例？

固定元素和绝对元素不属于文档流。也就是说，它们不像正常定位的元素那样占用空间。

因此，在您的示例中，固定元素将具有相对的元素，正如您所发现的，因为它们可以位于相同的 x-y 空间中。如果您将其视为绝对，则 top:0; left: 0，同样的事情也会发生。

接下来，你有一个（几乎）作为浮动，所以让我们考虑浮动改变了所有的定位。花车的布置方式很“特别”。它们处于流动状态，但会尽可能向上并沿漂浮方向。如果它们太宽而无法容纳该行上的其他浮动内容，它们将转到下一行。

你可以做

<style>
 #a
  {
  float:left;
  height:100px;
  width:150px;
  background-color:black;
  }
  #b
  {
  clear:left;
  height:100px;
  width:150px;
  background-color:green;
  }
 </style>
 <div id='a'>aaaaa aaa</div>
 <div id='b'>bbb bbb</div>

“清除”意味着元素将出现在浮动的先前元素下方。 #b 将位于下一行，#a 下方。您还可以使 #a 在右侧有一个很大的边距，或者足够宽以填充任何容器而不为 #b 留出空间，使 #b 位于 #a 下方而不是旁边。