È possibile bypassare l'antenato posizionato più vicino?

Question

"L'elemento posizionato in modo assoluto è posizionato rispetto all'antenato posizionato più vicino." - MDN: position - CSS

ho capito questo quando c'era un genitore che è stato definito come position:relative; ma quello che non mi rendevo conto che ero position:absolute tecnicamente qualificato come un "antenato posizionato".

Ecco un esempio: http://jsfiddle.net/MSzZG/ Sarebbe bello se il testo "In alto" potrebbe avere la proprietà top applico alla finestra al posto del contenente div ma proprio non riesco a capire se è possibile bypassare.

<div> 
<div>Content 
</div> 
</div> 
<div style="position:absolute;"> 
<div style="position:absolute;top:0px;">At top 
</div> 
</div> 

C'è un modo per aggirare un elemento assoluto precedentemente posizionato (senza usando fisso)? Una soluzione javascript è accettabile.

Answer 1

Dovrai calcolare la differenza tra la sua posizione naturale e la posizione desiderata per posizionarlo assolutamente nella finestra.

Se si utilizza jQuery, è possibile lasciar fare i calcoli per voi tramite la funzione .offset(coordinates).

Answer 2

Se si desidera posizionare il div interno position: absolute relativo alla finestra (che è necessario specificare position: relative on), non è necessario nidificarlo.

position: absolute sarà SEMPRE posizionato rispetto al suo genitore posizionato PIÙ IMMEDIATO (con position: absolute o position: relative). Non puoi ignorarlo: devi solo strutturare meglio il tuo codice HTML o implementare il CSS in modo diverso.

Quindi, in pratica la risposta alla tua domanda è no :(almeno non senza l'utilizzo di posizionamento fisso che specificamente non menzionati voler fare.

Answer 3

risposta

No. Non è possibile farlo.

Ragionamento

Se tu fossi in grado di farlo, allora si potrebbe posizionare un div completamente lontano dal genitore. Questo non solo fare il genitore "solitario", ma anche del tutto sconfiggere le finalità di nidificazione. nesting tag div oqualsiasi tag per quella materia non è fatto solo per scopi cosmetici; è fatto per trasmettere testuale significato all'utente.

Posso suggerire di riconsiderare il tuo approccio? Forse se spieghi cosa vorresti che il risultato finale diventasse, possiamo aiutarti. ci deve essere sicuramente una soluzione.

Possibili soluzioni

• Se è necessario il div interno essere posizionato in alto poi prendere un livello fuori.
• rimuovere il posizionamento assoluto dal genitore.
• Utilizzo di un altro metodo di posizionamento diverso da assoluto.