Skip to main content

Z-index property that is independent from Auto Layout


Show first post

Wouter_schreuders

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.


Mateus_De_Freitas_Aviani_Belli

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.


Travis12
  • New Member
  • July 13, 2023

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.


Alina_Khazanova

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


alexf
  • November 7, 2023

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
  • November 27, 2023

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


Richard_Rolfs

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

Need a fix for that too


Pierre_Duchene

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

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.


neff
  • April 19, 2024

+1

No possibility of dropdowns is pretty embarrassing.


+1
Z index would be very useful in auto layout


Gloria_Lee

+1 for this 👍


  • April 29, 2024

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.


Vincent_Wasteels

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


  • May 29, 2024

Please @figma prioritise this issue.


Svetoslav_T

+1 for this 🙏


Chris_Kelley

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.


J_Yun1
  • October 31, 2024

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.


Salix_Dubois

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


MacDonald_Dan

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


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings