why -webkit-transform: translate3d (0, 0, 0) crea problemi con i childs fissi

Question

Ho cercato per le ultime ore di capire come mai un elemento figlio stava posizionando contro il suo genitore e non lo schermo anche sebbene sia posizionato come 'fisso'. Molto fortunatamente, mi sono imbattuto nel menzionare il fatto che il -webkit-transform: translate3d(0, 0, 0) sul genitore può rendere le cose andare storte. Sto usando il framework bootstrap e quindi hanno effettivamente messo questa proprietà sulla classe .navbar-fixed-top che aveva uno degli elementi parent. Una volta rimosso, il bambino ha iniziato a posizionare la vista di agains. Quindi ho due domande:

1. Perché -webkit-transform: translate3d(0, 0, 0) fa queste cose brutte?
2. Perché i ragazzi bootstrap hanno inserito questa proprietà per la classe .navbar-fixed-top?

UPDATE
Beh, sembra che ho trovato la risposta alla seconda domanda. Ecco il messaggio di commit:

Applicata translate3d al modale, barra di navigazione-fisso e apporre per combattere il browser ridipingere

ecco la risposta alla seconda domanda:

Qualsiasi computerizzata valore diverso da none per i risultati della trasformazione nella creazione di un contesto di stacking e di un blocco contenitore. L'oggetto funge da blocco contenitore per i discendenti posizionati fissi.

Answer 1

prima domanda:

Stai utilizzando trasform. Questo è ciò che sta causando il problema.

Date un'occhiata a spec: The Transform Rendering Model

Specificando un valore diverso da ‘none’ per la ‘trasformare’ immobile istituisce un nuovo sistema di coordinate locale l'elemento che viene applicato a .

Così l'elemento con posizionamento fisso diventerà relativamente all'elemento con la trasformazione - non il viewport

Answer 2

ho usato questo "aggiustamenti" (- webkit-transform: translate3d (0, 0, 0)) per risolvere anomalie da trasformare scala (alcuni elementi in cui si muovono come mi era interagire con la pagina), ma ho avuto un problema con la posizione fissata su webkit (non ho potuto impostare l'attenzione sugli input di testo posizionati in modo fisso) e quando l'ho rimosso è stato corretto.Come stavo usando la scala di trasformazione solo su firefox non c'era alcun problema da rimuovere (Su webkit I finito usando lo zoom che funziona molto meglio di transform: scale (ma -webkit-transform: translate3d (0, 0, 0) era lasciato lì da legacy css) e spero che Firefox supportasse anche lo zoom)