2013-12-10 36 views
10

Mam problem z "naprawionym" elementem w Google Chrome. Element zachowuje się tak, jak powinien w innych głównych przeglądarkach.pozycja: poprawiona nie działa w przeglądarce Google Chrome

Oto css:

#element { position: fixed; bottom: 0px; width: 100%; height: 50px; z-index: 10;} 

Problem jest, gdy strona ładuje element jest zamocowany na dnie wziernika, jak powinno być. Po przewinięciu pozostaje w tym samym miejscu, w którym znajdowała się po załadowaniu strony - nie pozostaje przymocowane do dolnej części ekranu.

Każda pomoc jest doceniana.

Dzięki

+2

Twój problem musi być większy, ponieważ nie można go odtworzyć za pomocą tej reguły CSS na chrome, czyli. http://jsbin.com/UcIpANol/1/ działa dobrze w Chrome. – Erik

+0

Czy możesz dodać [JSFiddle] (http://jsfiddle.net/) –

Odpowiedz

27

spróbuj dodać następujący kod do elementu:

-webkit-transform: translateZ(0); 
+0

Dzięki! To działało świetnie. – Dln

+3

cieszę się, że mogę pomóc. Prawie zjadłem oczy projektując różne urządzenia/przeglądarkę ... edytuj: jeśli to pomogło, zaakceptuj jako poprawną odpowiedź, to może pomóc także innym – scooterlord

+0

, co czyni mnie jeszcze gorszym: Porównaj http: // jsfiddle .net/Supuhstar/t04nh943/to http://jsfiddle.net/Supuhstar/t04nh943/2/ – Supuhstar

7

miałem właściwość: -webkit perspektywa: 800; na znacznika body .. Usunięto tym i pozycjonowanie stałe zaczął ponownie ... niejasne, ale warto spojrzeć

+3

DZIĘKUJĘ. TY. BYŁAM. CHODZENIE. ***SZALONY***. –

+0

dziękuję pracował dla mnie –

+0

Działa to również dla mnie, jeśli usunąłem właściwość perspektywy, ale potrzebuję jej dla efektu paralaksy ... To jest do bani. – pmrotule

4

Jako dodatek do wygranej odpowiedź: to nie będzie działać jeśli masz „-webkit -transform-style: preserve-3d " w jednym z elementów nadrzędnych. Nie wiem dlaczego, właśnie to miałem i usunąłem.

1

musiałem wyłączyć:

-webkit-transform: none !important; 
transform: none !important; 

zrobić to za mnie.

Powiązane problemy