在这个非常简单的例子中定位有什么问题？ （MS IE 8）

Question

这是HTML

<div class="panel" id="Panel1">
<fieldset style="position: absolute; top:8px; left: 136px; width: 136px; height: 48px;">
<legend> </legend>
  <div class="label" id="Label1" style="position: absolute; top:8px; left: 16px; width: 81px; height: 14px;">panel one</div>
</fieldset>
</div>

<div class="panel" id="Panel2">
<fieldset style="position: absolute; top:8px; left: 272px; width: 185px; height: 64px;">
<legend> </legend>
  <div class="Label" id="Label3" style="position: absolute; top:8px; left: 64px; width: 64px; height: 14px;">panel two</div>
</div>

这是CSS

body {
 background-color: white;
 width: 100%;
}

.panel, Label, .fieldset {
  font: 8px Arial; 
  border: 0px;
  margin: 0px;
  padding: 0px;
}

第一小组有left=136px和width=136px，而第二小组有left=372px，但当我在MS IE 8中查看它们时，它们会重叠。是什么赋予了？

---

几点信息

• 显然，我是一名相对的CSS新手。
• 这是在Windows程序中设计表单然后在浏览器中查看它的项目的一部分。它必须是WYSIWYG，这就是我给出精确坐标的原因，而不是允许浏览器布局页面。
• 但是style="position: fixed;可能会更好吗？
• 我不确定我是否需要定位div及其内容，但是，如果只有一个，那么哪个？
• 我使示例尽可能简单，但它必须扩展为乘以嵌套的字段集
  • 我别无选择，只能使用MS IE，虽然我可以推荐一个（最小）版本。

提前感谢您提供任何帮助

Answer 1

您的HTML不正确。 fieldset元素上的样式定义应位于面板1和面板2的div元素上。另外，panel2中的fieldset标记未公开。

试试这个HTML：

<div class="panel" id="Panel1" style="position: absolute; top:8px; left: 136px; width: 136px; height: 48px;">
    <fieldset >
        <legend> </legend>
        <div class="label" id="Label1" style="position: absolute; top:8px; left: 16px; width: 81px; height: 14px;">panel one</div>
    </fieldset>
</div>

<div class="panel" id="Panel2" style="position: absolute; top:8px; left: 272px; width: 185px; height: 64px;">
    <fieldset >
        <legend> </legend>
        <div class="Label" id="Label3" style="position: absolute; top:8px; left: 64px; width: 64px; height: 14px;">panel two</div>
    </fieldset>
</div>​

Answer 2

正如Strelok所指出的那样，HTML中存在错误。我还注意到你的css引用的是带有一类fieldset的元素你想要它们在fieldset本身吗？

如果是这样，请在css中删除.之前的.fieldset

Answer 3

尝试将亲戚放在周围的div上。

.panel{posistion:relative}