Metro Pro mobile issue with Header Right widget

[UmpquaWeb]

I added a menu and tagline in the Header Right widget, but they are getting cut off on the mobile version. I set the .site-header .widget-area to 450px, which gives me the width I want on a desktop, but it's not responsive. I've tried rem and em, but 1) it messes it up on desktop and 2) it's still not responsive. What do I need to do to fix it?

http://cityofglendaleor.com/

[Victor Font]

Although rem is a better choice for mobile responsive text, using rem or em in and of itself does not make a theme mobile responsive.

You are using version 2.0.0 of the Metro Pro theme. This early version is not fully mobile responsive. There's no jQuery or CSS included with that version that supports mobile responsive menus. The current version 2.2.2 is fully mobile responsive.

You have 2 choices, you can either download the current version and overwrite what you have, or if you have made customizations to your current functions.php and/or style.css, you can download the current version and carefully cut and paste the customizations from the old version to the new before updating the child theme.

Also, 450px seems to be too small for the header-right menu area. It wraps to a second line when I view it on my desktop. This article can help you understand how the Genesis header functions: https://victorfont.com/understanding-genesis-framework-site-header-layout/

---

Regards,

Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?

[UmpquaWeb]

Thank you, Victor. You are always a fountain of information. I will check out the article and then determine my course of action.

[Author]

Posts