My scenario is with two Layouter Items side by side, the 1st Item (above the 2nd in the Layers sidebar) holds a container set to 100% width, which contains a Title Text element set to Max content width (so it doesn’t wrap the text). If this text is wider that the overall width of the Layouter Item 1, why is this then hidden behind Item 2, which below Item 1 in the Layers sidebar? All Item 1 element overflows are set to show, and Item 1 is positioned above Item 2 in the Layers panel.
Surely in this case the text content overflow from Item 1 should show above anything in Item 2?
I’ve just found that if you pin content to the Layouter, taking it out of the Item, you can achieve preceding Item content overflow above following Item content…but this doesn’t explain why content from Item 1 won’t ‘naturally’ overflow, and be shown above Item 2 content, when Item 1 is higher in the Layers hierarchy, and all of Item 1 element’s overflow is set to ‘show’.
Hey,
I’m Liron from Editor X
Layouters are using flex technology, to allow the items automatically adjust to any screen size. The order reflected in the Layers panels shows the flex order (items order) and not the DOM order and what will overlap above each item.
As a result, If you’ll try to reorder items from the layers they will switch their places, and they will always overlap each other only by the order of the items.
Pinned Position is a good solution but for your case, you can just change the order of the Layouter:
Select the Layouter
Open the Inspector panel
Set the Layouter’s direction to ‘Right to Left’.
This way the first item will overlap the second one. Just make sure you organize back the order of the items using the layers or the Manage Items panel, so the last item will be shown first again.
