[Resolved] Accordion / Tab

[ammgbr]

On my homepage, I have a navigation block menu within a GB tab (which is itself within a GB accordion) not expanding completely with only 2 submenu options visible on click:

Accordion (name: investing) > Tab (general) > navigation block (Indices: List of companies) > submenu: only the first 2 links are visible.

Is there any fix I have been missing? I have tried deleting the nav block and reinserting it. It was working fine previously (within another block )

[Fernando]

Hello there,

Can you try adding this through Appearance > Customize > Additional CSS?:

.home nav.is-layout-flex.wp-block-navigation ul.wp-block-navigation__container li.wp-block-navigation-item.has-child.wp-block-navigation-submenu ul.wp-block-navigation__submenu-container {
    overflow-y: scroll;
    height: 100px;
}

[ammgbr]

This works only for items further up the list, the ones towards the end dont generate this css – you can only see the first 2 options from the submenus

[David]

Hi there,

1. remove Fernandos CSS

2. Add this CSS:

.wp-block-navigation.custom-nav .wp-block-navigation-item {
    display: grid;
    grid-template-columns: 1fr 10px;
}
.wp-block-navigation.custom-nav button[aria-expanded="true"] + span + .wp-block-navigation__submenu-container {
    position: static;
}
.gb-container .gb-shape {
    position: absolute;
    overflow: hidden;
    pointer-events: none;
    line-height:0
}

3. Select the Navigation Block in Advanced > Additional CSS Classes add: custom-nav

[ammgbr]

Thank you that resolved it!

[David]

Glad to hear that

[Author]

Posts