I'm using the Slick slider in my theme https://kenwheeler.github.io/slick/ and Material design lite https://getmdl.io/

Problem I am having is that the transforms used here are conflicting with the Wordpress admin bar and causing it to disappear. If I comment these out it works better, but still disappears if the slide is in transition to the next slide.

.slick-slider .slick-list, .slick-slider .slick-track {
-webkit-transform: translate3d(0,0,0);
-ms-transform: translate3d(0,0,0);
-o-transform: translate3d(0,0,0);
 transform: translate3d(0,0,0); 


I've tried setting useTransform to false on slick but that didn't help.

  • Try adjusting the admin bar z-index so it and the drop downs are in front of the slider. Sep 29, 2016 at 20:07
  • Cool. If you move the solution into an answer that'll keep the site format tidy. In a couple of days you can accept your own answer too. Sep 29, 2016 at 20:18

2 Answers 2


Adding a css rule for #wpadminbar:

transform: translate3d(0,0,0);
background: black;
width: 100%;

Makes the bar appear and

I added z-index: 0; to .mdl-layout__header to make the dropdowns appear.

Not the prettiest.


insert this into your style.css:

body #wpadminbar{z-index:99;}

and maybe this solves.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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