1

Want to display sticky sidebar in magento website. As the sticky sidebar is working in Mozilla firefox but unable to work in google chorme.

CSS code used for sidebar

#sidebar {
border-radius: 0 !important;
bottom: 0;
color:#fff;
border:2px solid #000;
margin-bottom: 10px;
margin-left: auto;
opacity: 1 !important;
top: 0 !important;
position: -webkit-sticky;
position: -moz-sticky;
position: -ms-sticky;
position: -o-sticky;
position: sticky;
scroll-behavior: smooth;
overflow-y: scroll;
 height: 45em;
}
.sidebarfixed{background: #f4f4f4;
        border-left: 1px solid #ccc;
        position:absolute;
      } 
0

Chrome browsers do not yet support the sticky value. In Chrome 28, as it switched to Blink engine, Chrome decided to remove the sticky position from its code-base, and it even removed the option to enable it through the chrome://flags page enter image description here “The current implementation of position sticky in Blink does not integrate correctly with compositing or scrolling. We eventually want to implement position sticky, but the current implementation is getting the way of work to improve scrolling and compositing. Once scrolling and compositing are in better shape, we can re-introduce position sticky in a way that integrates correctly with the rest of the system.

https://webdesign.tutsplus.com/tutorials/sticky-positioning-with-nothing-but-css--cms-24042

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.