Sorry, first time posting here.
Putting a nestable accordion inside an offcanvas menu. If Items inside the content block of the nestable icon are longer than the viewport the nestable accordian disappears.
Hi,
Welcome to the forum, and thanks so much for your report!
Unfortunately, I cannot replicate the issue. Would you be so kind as to provide a live link and a screencast using https://jam.dev showing and explaining what’s happening?
Best regards,
timmse
test.therapeuticconversations.ca
It’s on mobile where the issue is as my offcanvas appears only on mobile. I have a query div for post type, and two images under one accordion. The second accordion is just a basic text. The third accordion is a very long basic text.
Sometimes I get the behaviour replicated on my laptop as well in the editor. Putting enough items in my canvas item and then selecting on the accordion tab will make it disappear.
I originally had another block/div underneath the content that was basically used as a wrapper as I heard that was an issue sometimes but it’s not working with this one.
I’ve done a screencast
OK, I figured it out. Under the Nestable Accordion, I had to set the height to 100. Something so simple screwed me up for 2 days. You would think that would be set.
Probably has something to do with the accordion put under the offcanvas.
Thanks so much for the additional information!
Can you tell me what exactly you set to “100” to solve the problem?
I had to set the Accordion (Nestable), Style, Sizing (Height) = 100.
Thanks, I see.
The root cause is most likely the flex-wrap: wrap on .brx-off-canvas-inner.
Please remove your accordion height setting for a minute and add this custom CSS to the offcanvas element’s desktop breakpoint:
%root% .brx-offcanvas-inner {
flex-wrap: nowrap;
}
Does it fix the issue?
Thank you, yes confirmed this fixed the issue.
Ok, I’m glad to hear that. The flex-wrap behavior must be adapted depending on the scenario and breakpoint. Unfortunately, we cannot offer a universal solution for this.