Css 绝对定位的DIV不停留在相对定位的DIV父级中_Css

Css 绝对定位的DIV不停留在相对定位的DIV父级中

css

Css 绝对定位的DIV不停留在相对定位的DIV父级中,css,Css,我把我的问题简化为一个简单的例子。我有多个位置：相对div容器，比如支票，每页一个。我使用position:absolute div在支票上显示数据。第一次检查时布局良好，但以下所有检查数据覆盖第一次检查。在本例中，复选数字都位于右上角的第一个框中。在我的一个测试中，它在打印预览中看起来正常，但在屏幕上却不正常。我已经在IE和Firefox中进行了测试 <!DOCTYPE html> <html> <head> <style type="text/c

我把我的问题简化为一个简单的例子。我有多个位置：相对div容器，比如支票，每页一个。我使用position:absolute div在支票上显示数据。第一次检查时布局良好，但以下所有检查数据覆盖第一次检查。在本例中，复选数字都位于右上角的第一个框中。在我的一个测试中，它在打印预览中看起来正常，但在屏幕上却不正常。我已经在IE和Firefox中进行了测试

<!DOCTYPE html>
<html>
<head>
  <style type="text/css">
    .check {
        position : relitive;
        width : 200mm;
        height: 2.5in;
        border : 1px solid Black;
    }
  </style>
</head>
<body>
   <div id="Check608" class="check" >
      <div style="height: 100%; background: #ee3e64;">Check 1</div>
      <div style="position: absolute; top: 8mm; left: 175mm;">608</div>
   </div>
   <div id="Check609" class="check" >
      <div style="height: 100%; background: #44accf;">Check 2</div>
      <div style="position: absolute; top: 12mm; left: 175mm;">609</div>
   </div>
   <div id="Check610" class="check" >
      <div style="height: 100%; background: #b7d84b;">Check 3</div>
      <div style="position: absolute; top: 16mm; left: 175mm;">610</div>
   </div>
</body>
</html>

你错发了relitive。它应该是这样相对的：

.check {
        position : relative;
        width : 200mm;
        height: 2.5in;
        border : 1px solid Black;
}

正如这把小提琴所展示的那样，它工作正常：

位置：relitive是你的拼写错误吗？它是相对的而不是relitive。这是你的问题中的一个输入错误，还是你的代码中的一个输入错误？我花了几个小时看代码。不知道我什么时候引入了拼写错误。第二双眼睛可以捕捉到简单的事情。复制和粘贴时拼写错误。当我删除内联样式时，我一定是为了清理我的样式表而这样做的。谢谢你的帮助。