Skip to main content

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

This problem needs to be solved by Figma, if they don’t want to go the Z-index route then an possible solution could just be to toggle a “Always on top” setting within the prototyping feature.


Quoting Billie Joe:



Are we we are, Are we we are the waiting…



without adjustable Z-index, drop downs as table row actions in auto-layout is pretty much not attainable or at least very inconvenient. Absolute positioning might help but will introduce all sort of other nightmares.


At the very least, the ability to reverse the z-index ordering would be helpful. That would probably be a workable solution for most situations, even if it required some hackish nonsense using multiple auto-layout layers.


Edit: I just discovered that the “canvas stacking” feature exists, which does allow you to reverse the order, so at least that option exists.


I have a lot of trouble showing floating elements like tooltips / dropdowns because of this. Dropdown menus are possible to “hack” with tricks like “last on top” in auto layout.

But tooltips that must appear above everything, especially in situations when they’re inside a container that must be clipped, for example, is a nightmare.


We need a Z index option, or at least an option to “display above everything”


Example of tooltip issues attached


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.


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.


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


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


Need a fix for that too


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”


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


@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.


+1


No possibility of dropdowns is pretty embarrassing.


+1

Z index would be very useful in auto layout


+1 for this 👍


We’re approaching the 3 year mark on this issue, so we can perhaps look forward to a Mod message soon saying they read it.


@Figma_Moderation you have already been pinged on this thread, can we have a feedback from the product team at Figma please ?


Please @figma prioritise this issue.


+1 for this 🙏


This is sad that this idea has been open for years without development. Adding a z-index to the position pane that is configurable seems like it would be relatively easy to add, and it would have a huge impact.


It’s pretty crazy that Figma decided to “revamp” the UI but ignored to fix an actual problem that could improve a lot of people’s workflows.


+1 !


Since after 3 years there’s no answer from Figma_Moderation, trying @Figma_Team 🤷


At the very least, an aknowledgement that this issue as been seen would be nice.


Will add my voice here that trying to create components with auto layouts as part of our design system and the lack of some way to create a z index /overlapping seriously hampers ability to make functional components that the rest of the team can use without detaching instances so they can fake a dropdown menu etc.


Reply