Hi Ronnie,
Would it be acceptable if the mobile menu gets narrowed? Please try adding the below CSS code to Appearance > Customize > Additional CSS in your site dashboard.
Regards,
Kharis
Hi Kharis,
I’m not sure what you mean by narrowed. Like reduce the height of the menu? Also, which CSS code?
Thanks,
Ronnie
Hello there,
I am sorry, I hit the submit button too fast. Here is the code:
#mainnav-mobi {
right: 0;
width: 170px;
}
#mainnav-mobi ul > li > a {
padding-left: 15px;
padding-right: 15px;
}
Regards,
Kharis
Hi Kharis,
Thanks for the code. It didn’t seem to work, however. Is there a way for me to attach a screenshot of how the website looks on my phone, so that you can see what I’m referring to? I’m not sure what happened to the code because I didn’t change anything. The menu’s black background now drops too low, and it partially covers / overlaps over the page’s title. Any thoughts on why this occurred?
Thanks,
Ronnie
ps The issue only occurs in portrait mode.
To attach a screenshot in your reply, you have to upload it first to the free file hosting service like cloudup.com. Then share its link here.
Regards,
Kharis
Hi Kharis,
Sorry for the late reply. I’ve gone ahead and created an account with CloupUp.com. Here’s a link that illustrates how my mobile menu drops down too low. Hope you can help me figure it out. 🙂
Thanks,
Ronnie
Hello there,
Please try adding the below CSS code:
@media only screen and (max-width:767px) {
.btn-menu {
margin-top: -10px;
}
}
@media only screen and (max-width:500px) {
.text-slider .maintitle {
font-size: 28px;
}
.text-slider .subtitle {
font-size: 14px;
}
}
Let me know how it works for you.
Regards,
Kharis
Hey Kharis,
Yes, it worked. Thanks so much! You’re the man!!
Best,
Ronnie
