Witam,
problem mam następujący: mam sobie diva z formularzem itp. wysokosc jest automatyczna, paddingi nadane:
<div class="product-details">
...
</div>
.product-details
{
padding: 50px 50px 100px 50px;
width: 474px;
position: -webkit-sticky;
position: -moz-sticky;
position: -ms-sticky;
position: -o-sticky;
position: sticky;
background-color: #FFF;
z-index: 100;
bottom: 0;
}
W JS (a bardziej jQuery) pobieram wysokosc tego elementu (nie pytajcie po co, zbyt duzo tlumaczenia).
orderPanel_height = $('.product-details').outerHeight() + 20; //specjalnie dodane 20px, nic sie nie zmienia po usunieciu
Kiedy pracuje na monitorze 1920x1080/1366x768 jest wszystko git, poprawnie oblicza (console.log wypluwa 533).
(tutaj screen jak wyglada z inspectu na chrome)
Problem zaczyna sie natomiast kiedy zmienie rozdzielczosc (CTRL + scroll, zmiana powiekszenia). Po zmianie na 90% powiekszenia lub inne (nie wszystkie) ten sam console.log wypluwa 685.085, mimo, ze w inspekcie wyglada to prawie tak samo:
Ogarnia ktos o co z tym chodzi? Czemu na jednych rozdzielczosciach jest ok, a na innych nie? Z tego co sie dowiedzialem to u innych na wiekszej rozdzielczosci tez sie buguje (ale nie wiem jaka konkretnie).
P.S. tak samo z szerokoscia tego boxa, zmienia sie z 474 na 573.991.
EDIT: bug wystepuje tylko na chrome i operze (i nie wiem jak na safari)