2

I have an image set to scale on the active state. However, i'm having a strange issue which seems to be isolated to Safari where the number dials within the input boxes will not stay behind my image:

Image Overlap

here is my css for the active state: 

  .product_front img:active {
  outline: none;
  background-color: white;
  -webkit-transform: scale(2.5);
  -moz-transform: scale(2.5);
  z-index: 9999;
}

Any help is greatly appreciated - Thanks!

akes406
  • 531
  • 1
  • 4
  • 17
  • It is very likely that your CSS transform is establishing a new stacking context. Have you considered using translation along the z-axis instead of using z-index? Related issue: http://stackoverflow.com/questions/20851452/z-index-is-canceled-by-setting-transformrotate. – Terry Jan 11 '16 at 00:17
  • That's probably a bug – xpy Feb 12 '16 at 12:34

0 Answers0