title: CSS transition not working in Chrome
body: <p>I am using CSS transition to ease transition between images in a bootstrap carousel. This was working perfectly for months in Chrome and Safari. All the sudden it does not work in Chrome.</p>
  
  <p>HTML (in Jade):</p>
  
  <pre><code>div(class="item")
      img.landing-bg(src="images/aa/ny58.jpg", alt="")
  </code></pre>
  
  <p>CSS:    </p>
  
  <pre><code>.item {
      -webkit-transition: opacity ease-in-out 1s !important;
         -moz-transition: opacity ease-in-out 1s !important;
          -ms-transition: opacity ease-in-out 1s !important;
           -o-transition: opacity ease-in-out 1s !important;
              transition: opacity ease-in-out 1s !important;
  }
  
  .carousel .active.left {left:0;opacity:0;z-index:2;}
  
  .carousel .active.right {right:0;opacity:0;z-index:2;}
  </code></pre>