Sticky menu dropdown unscrollable -...
Hi everyone, I have searched everywhere for a solution on the internet but had no luck so far.
I want the dropdown elements to my sticky nav scrollable that are hidden under the fold. Do any of you clever people have a solution as really want to keep the sticky nature for the mobile and tablet screen sizes.
Kind regards, Phil
I want the dropdown elements to my sticky nav scrollable that are hidden under the fold. Do any of you clever people have a solution as really want to keep the sticky nature for the mobile and tablet screen sizes.
Kind regards, Phil
Phil Dias wrote:
Hi everyone, I have searched everywhere for a solution on the internet but had no luck so far.
I want the dropdown elements to my sticky nav scrollable that are hidden under the fold. Do any of you clever people have a solution as really want to keep the sticky nature for the mobile and tablet screen sizes.
Kind regards, Phil
Hi everyone, I have searched everywhere for a solution on the internet but had no luck so far.
I want the dropdown elements to my sticky nav scrollable that are hidden under the fold. Do any of you clever people have a solution as really want to keep the sticky nature for the mobile and tablet screen sizes.
Kind regards, Phil
Mastering The Understanding With Hands-On Learning
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
NEW TO "COFFEECUP SITE DESIGNER" FOUNDATION 6 FRAMEWORK?
STUCK ON SOMETHING?
LEARNING & UNDERSTANDING "THE HOW TO"? THE WHY'S & THE WHEREFORE'S?
WITH WAYAN'S STEP BY STEP TUTORIALS
A simple quick way to contact me
https://mawarputih.coffeecup.com/forms/contact-wayan/
I think I have solved it with a bit of custom css
#sub-nav {
height: 450px;
max-height: 450px;
width: 100%;
overflow-y: auto;
-webkit-overflow-scrolling:touch;
}
@media screen and (min-width: 40rem) {
#sub-nav {
height: 200px;
max-height: 200px;
width: 100%;
overflow-y: auto;
-webkit-overflow-scrolling:touch;
}
}
@media screen and (min-width: 64rem) {
#sub-nav {
height: auto;
max-height: none;
width: auto;
overflow-y: visible;
overflow-x: visible;
-webkit-overflow-scrolling:auto;
}
}
Here is the update link if anyone is interested in this fix which has alluded me for some time.
http://test.phildias.com/
Regards
#sub-nav {
height: 450px;
max-height: 450px;
width: 100%;
overflow-y: auto;
-webkit-overflow-scrolling:touch;
}
@media screen and (min-width: 40rem) {
#sub-nav {
height: 200px;
max-height: 200px;
width: 100%;
overflow-y: auto;
-webkit-overflow-scrolling:touch;
}
}
@media screen and (min-width: 64rem) {
#sub-nav {
height: auto;
max-height: none;
width: auto;
overflow-y: visible;
overflow-x: visible;
-webkit-overflow-scrolling:auto;
}
}
Here is the update link if anyone is interested in this fix which has alluded me for some time.
http://test.phildias.com/
Regards
I forgot my mobile phone at a friend's house today, so I can't check 

Ha en riktig god dag!
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Inger, Norway
My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.