- This topic has 42 replies, 5 voices, and was last updated 2 years, 7 months ago by David.
-
AuthorPosts
-
July 28, 2021 at 10:41 am #1874891YingStaffCustomer Support
Try this CSS:
nav#secondary-navigation { order: -1; } ul#menu-country-switch-1 li { padding-right: 10px; }
to change the background color of the earth icon, go for Customizing > Colors > Secondary Navigation > Background.
Let me know π
July 28, 2021 at 9:47 pm #1875231Reethanks the css works. but this setting didn’t:
Customizing > Colors > Secondary Navigation > Background.July 29, 2021 at 12:08 am #1875314ElvinStaffCustomer SupportHi Ree,
Can you try adding this?
nav#secondary-navigation li.menu-item.menu-item-has-children { background-color: #f7f8f9; }
July 29, 2021 at 3:22 am #1875507Reenot working by targeting the style in
<li>
. I inspected the elements the background is in the<a>
.
How to set in<a>
?July 29, 2021 at 8:27 am #1876011DavidStaffCustomer SupportThis line:
nav#secondary-navigation li.menu-item.menu-item-has-children {
becomes:
nav#secondary-navigation li.menu-item.menu-item-has-children a {
August 18, 2021 at 2:30 am #1899819ReeI used the above css it is working on desktop, but on mobile it is still not blending in the background.
You can have a look here
August 18, 2021 at 6:50 am #1900065DavidStaffCustomer SupportSet your background color to transparent ie.
background-color: transparent;
August 19, 2021 at 8:51 pm #1902018ReeThank you it works.
However In mobile I couldn’t click the links
3 top icons on the right side including the country switcher.August 19, 2021 at 10:31 pm #1902072ElvinStaffCustomer SupportCan you specify which devices did you test it on?
I’ve tried tapping on the 3 icons on mobile (Android – Chrome) and they seem to be working on my end.
But here’s the thing. Perhaps you’re tapping the icons before the whole site completely loads.
That can cause an issue because the country switcher is tapped before its script loads, it won’t work properly.
That said, this is a completely separate matter. One which involves site performance optimization. π
August 22, 2021 at 9:03 am #1904538ReeI tested on iphone – safari, iphone – chrome, android, no luck.
Something seemed to be covering the menu (only on the homepage) and the hamburger menu on the left doesn’t work as well.It’s not a performance matter because other pages are working well.
you can see there’s a blue block hovering while tapping on the dropdown
https://prnt.sc/1qemkm9August 22, 2021 at 12:04 pm #1904647YingStaffCustomer SupportHi Ree,
Try to add this CSS:
#mobile-header { z-index: 999 !important; position: relative; }
Let me know π
September 4, 2021 at 8:23 am #1918878Reedo you know why in android the menu went to second line? if the cart items is [1] it is also the same. I don’t have this issue on iphone though.
September 5, 2021 at 3:52 am #1919304DavidStaffCustomer Supporttheres simply not enough room on the header for all the elements to remain inline on the smallest screens.
Use this CSS to reduce the logo on small devices:@media (max-width: 360px) { .mobile-header-navigation .site-logo.mobile-header-logo img { height: 40px; } }
-
AuthorPosts
- You must be logged in to reply to this topic.