Skip to main content
Slava_Bronevitskiy
Active Member
Aug 19, 2021 3:10 PM UTC

Z-index property that is independent from Auto Layout

Currently there is a huge limitation in prototyping possibilities because any dropdown menus appear underneath the following element in the autolayout flow.

I can’t remove autolayout because it would break designs across all useage of design system components and we can’t properly demo prototypes. Anchored by the lack of a customizable z-index property.

image

54 replies

alexf
New Participant
Nov 7, 2023 10:44 AM UTC

This would be very useful! Having similar issues as above when you have droplists and menu components that show on click within a auto-layout table.

J_Yun1
Nov 27, 2023 6:02 PM UTC

Figma, please release this feature. Basically, z-index should override the elements rendering in the layer order. So that a certain element within an interactive component can be seen above other elements even if that component is below other elements within the layers panel.

Dec 6, 2023 9:35 PM UTC

I’m shocked that this hasn’t been resolved yet. 😒

Richard_Rolfs
Jan 12, 2024 3:13 PM UTC

This is needed so bad - major problem in building complex auto layout or even using basic position sticky on navigations ect… please fix!!

Florian_Riviere
Feb 15, 2024 2:39 PM UTC

Need a fix for that too

Pierre_Duchene
New Member
Feb 21, 2024 3:21 PM UTC

I need possibilities to create a layout more flexible than this simple flexbox based one.

  • play on z-index independently to the layer order (eg: equal to css position:relative; z-index:2)
  • grid display
  • element margin (yes in addition to the gap of the layout system), with values numbers and “auto”
Florian_Kall
Mar 27, 2024 9:28 AM UTC

Plus one. This is really a showstopper for auto-layout in prototypes.

Mar 27, 2024 7:53 PM UTC

@Figma_Moderation Can this get escalated to the appropriate group. The lack of control on z position (z-index or equivalent) is very prohibitive. The current solutions regarding absolute positioning, stack order, and layer (or frame) order are hacks and work-arounds that don’t even solve the problem entirely. The simple fact is that when something is absolutely positioned, there are times when that thing needs by “on top of” everything else on the screen. Examples of this are everywhere but include dropdown menus, combobox menus, tool tips or other hover indicators, etc. These are common UI elements and, quite frankly, it’s easier to prototype these scenarios up in HTML and CSS than it is in Figma using work-arounds. Some guidance on a solutions would be greatly appreciated by everyone encountering these issues.

neff
Apr 19, 2024 6:14 PM UTC

+1

No possibility of dropdowns is pretty embarrassing.

Apr 25, 2024 9:50 PM UTC

+1
Z index would be very useful in auto layout