Opacity, transition, and firefox?

there is an image, when you hover over which changes smoothly transparency:

#work img { <br>
width: 100%; <br>
opacity: 1.0; <br>
transition: 0.1 s ease-in-out; <br>
-moz-transition: 0.1 s ease-in-out; <br>
-webkit-transition: 0.1 s ease-in-out; <br>
}<br>
<br / >
#work article:hover img { <br>
opacity: 0.3; <br>
transition: 0.3 s ease-in-out; <br>
-moz-transition: 0.3 s ease-in-out; <br>
-webkit-transition: 0.3 s ease-in-out;<br>
}



the trouble is that firefox shows this change through a translucent black square.

in other browsers all the rules. spoils as png and jpg.

%D0%91%D0%B5%D0%B7-%D0%B8%D0%BC%D0%B5%D0


please help me
October 8th 19 at 02:22
1 answer
October 8th 19 at 02:24
Used this code in css
img {
width: 100%;
opacity: 1.0;
transition: 0.1 s ease-in-out;
-moz-transition: 0.1 s ease-in-out;
-webkit-transition: 0.1 s ease-in-out;
}

img:hover {
opacity: 0.3;
transition: 0.3 s ease-in-out;
-moz-transition: 0.3 s ease-in-out;
-webkit-transition: 0.3 s ease-in-out;
}

Firefox 10.0.2 release/debian linux — normal flight is working correctly, the black square there

Find more questions by tags Mozilla FirefoxHTML