css - Firefox mix-blend-mode bug -

i need use mix-blend-mode project multiply image on yellow div. it's working in chrome without problems in firefox, image turn black when container has same width , height image.

if image 1px higher run anyway. know why happens?

here code example. try in firefox , play around height value. it's going turn black when set height 500px.

thanks guys!

http://cssdeck.com/labs/t2uxoktu

.image {    background: #ffff00;    display: block;    width: 500px;    height: 505px;  }  .image img {    mix-blend-mode: multiply;  }

<div class="image">    <img src="http://unsplash.it/500/500">  </div>

i found need set background color behind image , div firefox render properly. if image takes part of div has mix-blend-mode set, background div containing or behind rest of div needs color set calculation work. seeing partial black divs before setting background color.

all said, example seems working in firefox 41 now.