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,

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!



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,