Problem with image hover occuring on IE10 and Firefox

Permalink
Hi,

I'm building a website for a non-profit organisation and I#m facing a problem I'm unable to solve:

I've added some css for image hovers which works fine in Chrome and Safari, but not in IE10 or Firefox. The exact same code outside the concrete5 works fine in all browsers.

.thumbnail{
z-index: 0;
}
.thumbnail1{
z-index: 0;
}
.thumbnail:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail1:hover{
background-color: transparent;
z-index: 50;
}
.thumbnail span{ /*CSS for enlarged image*/

HTML
<a class="thumbnail" href="#">
<img src="/index.php/download_file/view_inline/15/" style="width:250px; height:73px; border:0;" alt="Brunnen Apotheke" class="opacity"><span>
<img src="/index.php/download_file/view_inline/15/" style="width:666px; height:407px; border:0;" alt="Brunnen Apotheke" class="opacity"><br></span>
</a>


Any help is highly appreciated!

Patrick

 
ronyDdeveloper replied on at Permalink Reply
ronyDdeveloper
A live link will be more effective to find the bug

Rony
thunda69 replied on at Permalink Reply
You're right of course.

But I solved the problem by using the "Dual Zoom" block offered for free in the marketplace. Had to redesign some pages, but it works fine.

Thanks for looking at my stuff, it's highly appreciated.

Regards

Patrick
ronyDdeveloper replied on at Permalink Reply
ronyDdeveloper
Great to hear that it works for you.

Rony