La posizione assoluta non funziona

Sto provando a posizionare un div con id 'absPos' in posizione assoluta rispetto alla sua div principale. Ma non funziona, il div è posizionato nell'angolo in alto a sinistra della pagina.La posizione assoluta non funziona

mio codice di esempio è il seguente

<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>

Mi potete aiutare a risolvere questo problema. Nel mio caso reale invece del colore di sfondo rosso devo posizionare un'immagine di sfondo.

saluti

fonte

2010-09-30 Ram

Applicare position:relative al div genitore.

<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>

fonte

2010-09-30 12:34:48

è necessario dare genitore div relative prima posizione:

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

fonte

2010-09-30 12:34:52 Sarfraz

È necessario dichiarare il div genitore sia position: relative o position: absolute stesso.

relative è quello che stai cercando in questo caso.

fonte

2010-09-30 12:34:53

Se si posiziona un elemento con posizione assoluta, è necessario che l'elemento base abbia un valore di posizione diverso dal valore predefinito.

Nel tuo caso, se si modifica il valore di posizione del div principale in "relativo", è possibile risolvere il problema.

fonte

2010-09-30 12:36:04

Il nesimo genitore del mio elemento ha una posizione diversa da quella predefinita, ma ho bisogno che il mio elemento sia posizionato assolutamente in alto a sinistra della finestra, quindi esattamente l'opposto di questa domanda. Può essere aiutato? Perché funziona così? – Qwerty

È inoltre possibile applicare la posizione: assoluta al div genitore. Totale Codice sotto

<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>

fonte

2010-10-01 06:51:35 Rajasekar

Se, come me, si stava tentando di posizionare un elemento rispetto ad un altro elemento, l'elemento flottante deve essere dentro l'altro, non come fratelli. Ora il tuo position:absolute; può funzionare!

fonte

2015-07-09 16:02:54

risposta

Problemi correlati