Can I have a different color sub-menus for desktop and mobile?

[floydphillipsco]

I have been struggling to get the right color for both the desktop submenu #ffffff and mobile sub menu #303030 . I have listed the code I found in the forum below. However, the code will only allow for one background color, so no matter what I do, one is always the wrong color. Please help. I need code for the desktop site (#ffffff) and separate code for the mobile site (303030). Thanks!

}
ul.sub-menu {
background-color: #ffffff !important;
}

[rad]

Hi Floyd,

Thanks for reaching out.

It’s possible with the correct selector, using ul.sub-menu will, of course, change it globally regardless of device. You’ll need an additional selector to make it more unique, and that will be .x-nav-wrap.desktop and .x-nav-wrap.mobile

For example,

.x-nav-wrap.desktop ul.sub-menu {
background-color: #ffffff !important;
}

.x-nav-wrap.mobile ul.sub-menu {
background-color: #303030 !important;
}

You can check this tutorial on how you can get the correct selector. https://vegibit.com/css-selectors-tutorial/,
and https://www.competethemes.com/blog/find-css-selector-wordpress/

The above CSS only assumes you’re on a standard header and I don’t see any sub-menu from your site either., it should only serve as a guide and we don’t provide support or maintain the code given.

Thanks!