How can I customize mobile and desktop menus differently?

[GeorgeRizos]

Hi, I have a menu item on the desktop version to make a split between the bold and normal font menu buttons

But I would like to remove this for the mobile version only. At the moment, it looks like this on mobiel.

Also, is there a way to make the line on dekstop non-clickable?

website url is: https://thesnoozy.com/

[PageFly-Henry]

Hi @GeorgeRizos

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

@media (max-width: 767px){

li a[href=“/pages/coming-soon”] {

display: none !important;

}}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[GeorgeRizos]

Thanks it worked! Is there also a way to make the line non-clickable on the desktop version?

[PageFly-Henry]

You can try this code:

li a[href=“/pages/coming-soon”] {
pointer-events: none !important;
}