Vertical nested Tabs: Issue aligning Tab Content Area with two left vertical menus

Design help General
1

Hi Community,

I am relatively new to webflow and the community but already hooked: Really cool tool. But so cool, that I often run into trouble ;(

I am designing a technical UI with currently two nested vertical tabed menus. The menus work well, but I am not able to get the Tab Menu Content on Level 2 to go across the page. Instead it is stuck to the right side. I followed this short guide on how to do vertical tabed menus and it worked for the menu portion: Menu in DropDown Menu - My Sandbox.

The page in question is called o9 UI Framework within the 09 technical UI folder:

Here is how the page looks like with the div block pushing everything to the right:

1914Ă—628 39 KB

The misaligned text is part of the Menu Tab Content section and disappears when I change the menu:

1915Ă—438 21.2 KB

I hope to get some tips how to have the div block align to the left … I have tried many things.

Thanks for your help,
Swen

PS Once this works, I plan to create a third nested horizontal tab structure within some of the tabs … should be fun

Here is my public share link: https://preview.webflow.com/preview/ocean9?preview=ef5672b997ac6a1ffe32504d13d14b80
(how to access public share link)

2

“o9 L1 Tab Menu Content” is floated right. Switch that to either Left or None and you should be able to style it from there.

You’ve got a lot of nested elements. Best of luck to you. lol

1 Like
3

Thanks for your help, this fixed it and it makes total sense.

Cheers,
Ocean9

4

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.