-
AuthorPosts
-
January 9, 2026 at 2:27 am #1493741
We are using a larger logo this year for the 250th Birthday of America and it looks great on a computer but on mobile, the header seems to be locked at a height that makes the new logo far too small. Is there CSS code I can add to allow the header to be larger and centered on mobile?
Ideally the logo would span the entire top of the screen on mobile and the hamburger menu would be centered below the logo. URL is in private content area. Thanks in advance for your help!January 9, 2026 at 6:06 am #1493753Hey Brady,
Thank you for the inquiry.
The site looks unstyled when we checked it. Are you currently working on the site?
To make the logo larger on mobile view or to make it full width, try the following css code:@media only screen and (max-width: 767px) { /* Add your Mobile Styles here */ #top #header_main>.container .logo img { height: 200px; width: 100%; } }Please check the screenshot in the private field.
Best regards,
IsmaelJanuary 9, 2026 at 6:46 pm #1493775Thanks Ismael. I’m not a programmer at all, I just use a theme demo import then modify it from there, so I never get into any of the custom stuff…what is “unstyled” and how do I remedy that problem you identified?
January 9, 2026 at 6:49 pm #1493776I’m attaching one more link in private content, a screenshot of the mobile view on Safari. I don’t think I’ve ever looked at our Website on Safari mobile, but it looks bad. What am I doing wrong? Thanks in advance for the help!
January 10, 2026 at 9:43 am #1493784Hi,
Thanks for the update. Your site is loading styles as it should when I check it. If this problem should continue, then please try to temporarily deactivate file compression under Enfold->Performance, and activate the option to delete old CSS and JS files on the same page.
Best regards,
Rikard -
AuthorPosts
- You must be logged in to reply to this topic.
