[Bruno Waser]

How can I change the color for the menu for mobile devices only?
Please don’t tell me: “Send the login data for my website”
If that’s not possible for me to change, then this theme goes to waste. Friendly greetings

[Grace Themes]

Hi Bruno,

To change the menu color in mobile devices

Go to Appearance -> Editor -> style.css file
add below css code and change the color code as per your need.

@media screen and (max-width:767px) 
{
.header-nav ul li a, .header-nav ul li.current_page_item ul li a { color:#FF0000 !important; }
.header-nav ul li a:hover, .header-nav ul li.current_page_item a, .header-nav ul li.current_page_item ul li a:hover, .header-nav ul li.current-menu-ancestor a.parent { color:#00FF00 !important; }
}

Please do this change and let me know your feedback.

Regards
Grace Themes

[Bruno Waser]

Thank you. Worked perfectly.

Regards
Bruno Waser

[Grace Themes]

Hi Bruno,

You are most welcome..!

Regards
Grace Themes

[Holger Engel]

Hi, I have the same issue that the Menu color on mobile devices is different from the PC version.
With the tip above I could partially fix it:I could change the font colors to make it at leasdt legible.
However, how can I change the Menue background color to make it look as on the PC version?

A second issue: I added a page title & sub-title on my starting page. On mobile devices in horizontal view, the body text of the pages is now starting below the mainpage header and is partially not readable. How to fix?

Thx in advance!

Holger

[Grace Themes]

Hi Holger,

To change the background color of menubar in mobile devices
Go to Appearance -> Theme Options -> Basic Settings -> Background Colors -> Select background color for toggle menu

To change the menu background color in mobile version
Go to Appearance -> Editor -> style.css file
add below css code and change the color code as per your need.

@media screen and (max-width:767px) 
{
.header-nav ul li { background-color:#000000 !important; }
}

Second issue: Please send your website URL and some screenshot where the problem is getting so we can check and assist you.

Regards
Grace Themes

[Holger Engel]

Thanks – this works!
Will send you the screenshot of the second issue to oyur support E-Mail.
Thx,
Holger

[Grace Themes]

Hi,

1. To solve the issue, add below css code in
Appearance -> Editor -> style.css file

@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
.innerbanner { min-height:140px; }
}

Regards
Grace Themes

[Author]

Posts