Ron
Ron

Reputation: 4095

Opera Mobiles css3 rendering problems

when testing my website using Opera Mobile, I discovered some serious problems which I've no idea why they happen and how to fix them.

Here's a comparison between FF (Windows) and Opera Mobile (FF renders as expected):

enter image description here

Here's the jsfiddle with the source

Here are the differences:

  1. 1st image looks weird.
  2. 4th image disappeared.
  3. Images has partially/missing border-radius.
  4. box-shadow is missing.

I'm pretty sure that the box-shadow and border-radius are the main cause for the problems, because when removing them everything looks fine.

I would like to know why it occur and how to fix it....

Thank you very much!

Upvotes: 0

Views: 359

Answers (1)

karlcow
karlcow

Reputation: 6972

When you are removing opacity does it work better? It seems there is a very unfortunate bug mixing box-shadow and opacity. And it is tracked by CORE-39908 at Opera. I will add your example jsfiddle example to the bug report.

Upvotes: 2

Related Questions