3D-transforms and z-index in FF/Gecko

RESOLVED DUPLICATE of bug 810685

Status

()

RESOLVED DUPLICATE of bug 810685
6 years ago
6 years ago

People

(Reporter: swedenxpower, Unassigned)

Tracking

23 Branch
x86
Mac OS X
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Reporter)

Description

6 years ago
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_3) AppleWebKit/536.28.10 (KHTML, like Gecko) Version/6.0.3 Safari/536.28.10

Steps to reproduce:

Hi all.

I hope somebody could rise up the following problem or can help with solution.

The situation is next: I created a scene using CSS 3D-transforms.
Demo: http://websaints.net/demo/model/field.html

On webkit-browsers everything seems to be fine: http://websaints.net/demo/CHROME-1.png. But FF has another look on this: http://websaints.net/demo/FF-1.png

The problem is that the blocks that go later in DOM everytime are overlapping the blocks that are before.

Probably it's because webkit doesn't consider z-index in calculation of overlapping of transformed objects but gecko does.

My trying to solve this were next:
Apply to all objects position: static to drop z-index
Reduce the number of objects with transformations
Apply z-index to all the blocks

http://websaints.net/demo/model-v1/field.html
http://websaints.net/demo/FF-2.png

The first and the second one solution work so far enough but not for the scene with a big amount of objects...

http://websaints.net/demo/FF-3.png
http://websaints.net/demo/model-v2/field.html

The third one works with z-index recalculation but it will be huge enough and cannot be applied at all.

MacOsX 10.8.3
Latest chrome/canary and ff/nightly

I will be kindly happy hear all the comments you have.

Thank you in advance,
Ilya Pukhalski
Thanks for reporting this. It seems to be the same of bug 810685
Status: UNCONFIRMED → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 810685
You need to log in before you can comment on or make changes to this bug.