beagle-web-angular icon indicating copy to clipboard operation
beagle-web-angular copied to clipboard

Position absolute not playing well with other elements

Open Tiagoperes opened this issue 3 years ago • 0 comments

Beagle Angular version: 1.7.0

Steps To Reproduce

  1. Create an absolute positioned element
  2. Create a normal element
  3. Place both inside a container
  4. The absolutely position element will always be on top, even if I created it before the other one

Link to code example: https://playground.usebeagle.io/#/cloud/S3-8296c204-8747-4f75-8045-2393e2141a83/absolute.json?platform=react-web

The current behavior

The white div, in the example, appears behind the absolutely positioned element.

web

The expected behavior

I expected the white div to be positioned on top of the other one. Just like in Android and iOS.

mobile

In general, it is expected that the deepest elements declared in the tree (last) will be rendered on top of the others, despite of positionType.

Observation

This may be discussed with the mobile teams. How can we change the order? We have no equivalent to z-index.

Tiagoperes avatar May 04 '21 20:05 Tiagoperes