绝对位置不能正常工作

我想将id'absPos'的div放在绝对位置与其父div相关。但它不起作用，div被放置在页面的左上角。绝对位置不能正常工作

我的代码示例如下

<html> 
    <body> 
     <div style="padding-left: 50px;"> 
      <div style="height: 100px"> 
       Some contents 
      <div> 

      <div style="height: 80px; padding-left: 20px;"> 
       <div id="absPos" style="padding: 10px; position: absolute; left: 0px; top: 0px; background-color: red;"></div> 
       Some text 
      </div> 
     </div> 
    </body> 
</html>

你能帮我解决这个问题。在我的实际情况下，而不是红色背景颜色，我已经放置了一个背景图像。

Regards

来源

2010-09-30 Ram

将position:relative应用于父div。

<html> 
    <body> 
     <div style="padding-left: 50px;"> 
      <div style="height: 100px"> 
       Some contents 
      <div> 

      <div style="height: 80px; padding-left: 20px; position: relative;"> 
       <div id="absPos" style="padding: 10px; position: absolute; left: 0px; top: 0px; background-color: red;"></div> 
       Some text 
      </div> 
     </div> 
    </body> 
</html>

来源

2010-09-30 12:34:48

你需要给父母DIV relative位置第一：

<div style="height: 80px; padding-left: 20px; position:relative;">

来源

2010-09-30 12:34:52 Sarfraz

您需要声明父DIV要么position: relative或position: absolute本身。

relative是你在这种情况下寻找的。

来源

2010-09-30 12:34:53

如果要放置具有绝对位置的元素，则需要基本元素具有非默认值的位置值。

在您的情况下，如果您将父div的位置值更改为'相对'，则可以解决问题。

来源

2010-09-30 12:36:04

我的元素的nth-parent具有默认位置以外的位置，但我需要将我的元素完全放置在窗口的左上角，与此问题完全相反。它可以帮助吗？它为什么这样工作？ – Qwerty 2016-06-01 08:32:52

您也可以将位置：绝对值应用于父级分部。下面

<html> 
    <body> 
     <div style="padding-left: 50px;"> 
      <div style="height: 100px"> 
       Some contents 
      <div> 

      <div style="height: 80px;position:absolute; padding-left: 20px;"> 
       <div id="absPos" style="padding: 10px; position: absolute; left: 0px; top: 0px; background-color: red;"></div> 
       Some text 
      </div> 
     </div> 
    </body> 
</html>

来源

2010-10-01 06:51:35 Rajasekar

总代码如果像我一样，你试图在一个新元素的元素位置，浮动元素需要是其他的里面，还不如兄弟姐妹。现在您的position:absolute;可以工作！

来源

2015-07-09 16:02:54

绝对位置不能正常工作

回答

相关问题