Tab menu in container with 100% window content

Hi guys,

I was wondering if someone can answer this query for me.

I have quite a bit of content I want to put into Tabs, but I want to keep the Tab menu in a container, with the actual tab content able to display 100% width of the browser window. Is there an easy way to do this? It seems like you can’t separate elements of a container like this. I would rather keep the functionality of the tabs without resorting to just using separate pages.

Thanks!

Can you tell us the reason? it may help to solve it for you. Why does the tabs should be contained when the content not? Can you share your public link?

Ok as an example:

The first tab is fine as its all one colour background etc (the yellow tab)

The second tab however I want to be able to break down the content into sections. So to have a section like the white area that goes 100% width, but is still contained within the tab structure so when you click on the other tab you stay on this same page, but the content changes.

too difficult? I realise I can just do this with a different page for each button, but i thought it could be better to use tabs if possible.

No, but why the menu needs to be in a container ? it can just be on the same section, and set to be centered… be sure to select Display : block for the menu element, and set it’s left and right MARGINS to auto.

Block & Auto Margins, the most classic centering method.

1 Like

Hi,

Actually is very easy. Drop the widget tabs in any section. Give a class to the Tabs menu and just choose the Center option in Typography.