Come posizionare l'elemento sotto l'elemento posizionato relativo senza sovrapposizioni?

Se metto qualcosa dopo elemento con relativi + posizionamenti assoluti, si sovrappone. Non lo fa se specifichi l'altezza, ma non voglio farlo perché il contenuto dell'elemento relativamente posizionato è dinamico. Come sbarazzarsi della sovrapposizione senza specificare l'altezza?Come posizionare l'elemento sotto l'elemento posizionato relativo senza sovrapposizioni?

semplice esempio:

<div style="position:relative"> 
    <div style="position:absolute;"> 
     blabla 
    </div> 
</div> 
I WANT THIS BELOW

fonte

2013-07-27 gadelat

Vorrei usare 'float', ma se devi usare 'position', allora avrai bisogno di javascript. Commenta se vuoi una soluzione javascript. – twinlakes

Potresti fornire un esempio reale? Forse c'è un modo alternativo. Perché l'elemento interno deve essere assoluto? – nirazul

C'è un motivo per cui vuoi che il div interno sia posizionato in modo assoluto, ma che gli altri elementi rispettino il suo posizionamento nel flusso del documento? – thgaskell

visto che hai applicato position:relative al primo elemento o hai specificare il height o fornire padding-bottom ad esso.

Ad esempio, nel codice fornito ho applicato height di 20px ad esso.

Nota: Utilizzando height è meglio che usare padding-bottom per questo tipo di scenario

<div style="position: relative; height: 20px;"> 
    <div style="position:absolute;">blabla</div> 
</div> 
<div>I WANT THIS BELOW</div>

fonte

2013-07-27 14:34:20

Come ho detto, non voglio specificare l'altezza. – gadelat

absolute posizionamento tiene l'elemento fuori dal flusso della struttura. La sua presenza è ignorata per questo motivo, è ciò che è lo scopo. Se è necessario un elemento posizionato a sinistra oa destra quindi utilizzare float

Quando elementi galleggianti assicurano si cancella il fondo del div così poi il layout è conservato

<div style="clear:both;"></div>

DEMO http://jsfiddle.net/kevinPHPkevin/uHuSF/

Altrimenti un è necessario un approccio diverso per raggiungere il tuo obiettivo.

fonte

2013-07-27 14:44:50 Vector

Ho pensato che il posizionamento assoluto dovrebbe escludere l'elemento dal flusso del suo genitore relativamente posizionato, questo è un concetto imperfetto. – gadelat

Come posizionare l'elemento sotto l'elemento posizionato relativo senza sovrapposizioni?

risposta

Problemi correlati