Visibility: hidden in IE does not work

Question

I use this CSS to bootstrap the prev-next carousel on the slider:

.carousel .carousel-control{
   visibility: hidden;
  }
  .carousel:hover .carousel-control{
   visibility: visible;
  }

While it works in Chrome and Firefox, it does not work in IE10. Is there access to this solution?

Edit: jsfiddle is tested and it works in IE10, so there must be something else on the site. Any suggestions?

Answer 1

I think something else in your css makes this a disconnect because it is visibilitycompatible with IE10 source , this requires IE4 +

An alternative could be:

.carousel .carousel-control{
  opacity: 0;
}
.carousel:hover .carousel-control{
  opacity: 1;
}

Can you do jsfiddle?