Hi;
I have been battling with an interaction issue with my nested drop-downs: in short I am attempting to put a drop-down menu within a drop-down menu. The problem being that when I do that it removes any attributes of size of display and there seem to be no way to keep the div size to work properly or the content to get a proper size.
You can see it in its pure madness on the first two buttons of the menu:
Hops works where it simply put the first layer all out of proportion(although the next layer seems fine)
and industries where I just tested it on the first one and you can see the text overlap (while the same div is duplicated and works proper one layer below.)+
Any help will be much appreciated thanks!
Here is my public share link: https://preview.webflow.com/preview/lc-navtest?utm_medium=preview_link&utm_source=designer&utm_content=lc-navtest&preview=189fd7a7f59890e476cd5aff3e3f5548&mode=preview
Just as you can see the text overlaps, and that is the part I cant fix.
@Aleksejs_Avstreihs try adding 45px to the margin right to Nav Content Wrap class. This will add a space that will help you with the overlapping.
I could find a better solution but I would need to change the whole structure of the site.
Hope this helps,
Cheers
Hey thanks for the effort:
your solution works to the extent that it does clear the text from the div by extending it, but it ads 45px x3 to the whole lengh of this bar: so the last button actually is beyond the screen.
The problem is that adding a dropdown in a dropdown seem to screw with the overflow of that text div: I can also add a text break to reduce the length of that div but it does not solve the width of the container which is screwed regardless:
I might have to redo it all together, and I dont actually mind if I could understand what the issue is from.
So i seem to get closer:
I have added a white-space: pre-wrap to the text div and it seems to fix it in chrome…, now I cant seem to find it in webflow.
