Make Menu Tabs Scrollable
Standard member
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!
Site director
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.
Become a fan of Composr on Facebook or add me as a friend. Add me on on Mastodon. Follow me on Minds (where I am most active). Support me on Patreon
- If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
- If so, please let others know about Composr whenever you see the opportunity or support me on Patreon.
- If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying Composr on fun personal projects.
- If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Standard member
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!
Site director
Become a fan of Composr on Facebook or add me as a friend. Add me on on Mastodon. Follow me on Minds (where I am most active). Support me on Patreon
- If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
- If so, please let others know about Composr whenever you see the opportunity or support me on Patreon.
- If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying Composr on fun personal projects.
- If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Standard member
1 guest and 0 members have just viewed this.
