Element disappears only in Safari 10 (9 was ok), shows when I change any css
Here's the technique I use when I encounter this nasty bug in Safari.
I basically force a redrawing of the element with a css animation loop:
@keyframes forceRedraw {
from { box-shadow: inset rgba(0,0,0,0) 0 0 0; }
to { box-shadow: inset rgba(0,0,0,0.0000001) 0 0 0 10px; }
}
.container{
width: 100px;
height: 100px;
background-color: red;
animation-name: forceRedraw;
animation-duration: 4s;
animation-iteration-count:infinite;
}
Hope this helps!
You can try setting -webkit-transform: translate3d(0,0,0);
on the element to force GPU processing. That worked for me on a similar issue.