Changing menu elements in mobile menu

Hello, it’s been few years i’m using Travelify, and i am fully satisfied.
I just have a little question:

How can I hide/delete sub menu elements when the website is displayed on mobile?
I did a lot of research and i wasn’t able to find a functional solution.

Last thing I tried worked on chrome simulating mobile, but not on my phone. I added this code in the custom CSS part of the Travelify options.

.tinynav.tinynav1 option:nth-child(3) {
display: none !important;
visibility: hidden !important;
}

Thanks a lot, please continue doing great work!

Hello there,

I hope you are doing well today.

You can use the following CSS code to have the changes reflected on mobile by going to Appearance > Customize > Additional CSS and pasting it there.

@media only screen and (max-width: 700px) { .tinynav.tinynav1 option:nth-child(3) { display: none !important; visibility: hidden !important; } }

Best Regards,
Support

Hi, hope your doing fine too.

Thanks for you answer but it doesn’t work: It produces exactly the same result as I did: it works on a desktop browser (firefox on windows 10 actually), but not on my phone (safari on iOS 11).

If you have another suggestion, i’ll be glad!

Thanks!

Naga

Hello there,

This will take a bit of work to accomplish because of the way the menu works but try using this CSS code:


option:nth-child(3) {
    display: none;
}

Best Regards,
Support