Make Menu Tabs Scrollable
Posted
#6429
(In Topic #1412)
Pages, Content, Social, Etc.
Hi,My theme is called, "Gold". Menu Tabs (Home, Pages, Content, Social, Collaboration, About) are not scrollable. I have added many pages under the "Pages" tab. The dropdown extends past the viewable screen. How can I make the dropdowns scrollable?
I have tried going into themes/Gold/templates_cached/EN/menu_dropdown.css I have tried to set overflow to auto, adding overflow-y, changing the 3 spots where overflow are in the script, adding a max height with auto scroll, etc. Nothing works.
How should I do this?
Thanks so much!
Posted
Moderator
It's an odd thing to want to do, as we do support multiple levels of drop-down (subnesting).
However, this worked for me…
Code
.menu_type__dropdown ul.nlevel {
{$BETA_CSS_PROPERTY,box-shadow: 3px 3px 10px {$GET,standard_border};}
line-height: 1.4em;
border-top: 1px solid {$GET,standard_border};
border-left: 1px solid {$GET,standard_border};
border-right: 1px solid {$GET,standard_border};
max-height: calc(100vh - 290px);
overflow-x: visible;
overflow-y: auto;
background: white;
}
The last 4 rules are ones I added. Note how I had to use a viewport relative max height (regular percentages are document-relative), while taking off the pixels above the menu.
Posted
What page do I add this code to? Where should it be added on the page?
The reason I need this is that I have already added 20 php pages in site/pages/minimodules_custom. I use my down arrow on my keyboard to scroll through the dropdown, but I am not sure if everyone on my site knows how to do this.
Thanks again for your help and such a beautiful program!
Posted
Moderator
1 guest and 0 members have recently viewed this.
