Errore position fixed all’interno di un div parent

Ecco come risolvere un particolare e problema CSS

Nel tips utile del giorno dedicato a CSS3 vediamo come risolvere un errore position fixed all’interno di un div parent

Descrizione del problema

Il problema si manifesta quando vi è una struttura di questo tipo:

<div class="test"><!--Div Parente -->
<p class="fixed">DIV FIXED</p>
</div>

In presenza delle seguenti regole css applicate al div parente (o al body):

-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
-ms-backface-visibility:hidden;
-o-backface-visibility:hidden;
backface-visibility: hidden;

Di fatto il div fixed al posto di posizionarsi ad esempio in alto a destra del documento, si posiziona in alto a destra del div parente.

Soluzione

Per risolvere vi basterà eliminare le proprietà backface-visibility dal parent.

REFERENCE BACKFACE VISIBILITY

Questo articolo ti ha risparmiato qualche mal di testa? Condividilo o fammi sapere il tuo parere nei commenti!

Image credits “css” disponibile su Shutterstock

Lascia la tua opinione

×