when i open my store on desktop version my header menu items shows up but when i open it in mobile version my menu goes to side three lines and when i click on those three lines no menu items shows up how do i fix it ..
Hi @burhandar26
Will you make me to see your issue?
ok
Please let me know your shopify store URL like “xxx.myshopify.com” so that I can send a collaborator request.
i dnt think i need to add you in my store , but yes u can have a look on my store by my url and then can tell me the solution .
try and open it on mobile and u will see that u cant see my header menu items in header section
I think that you have this code in assets/component-menu-drawer.css.
.menu-drawer {
position: absolute;
/* transform: translate(-100%); */
/* visibility: hidden; */
z-index: 3;
left: 0;
top: 100%;
width: 100%;
padding: 0;
background-color: rgb(var(--color-background));
overflow-x: hidden;
filter: drop-shadow(var(--drawer-shadow-horizontal-offset) var(--drawer-shadow-vertical-offset) var(--drawer-shadow-blur-radius) rgba(var(--color-shadow), var(--drawer-shadow-opacity)));
}
Here, transform: translate(-100%); and visibility: hidden; are affecting. Please try to comment them.
should I remove this code from there ?
it was already like this there , so what i did was i removed this whole coding from there and now my menu items are showing in my mobile version as well …so why doing opposite as u r telling me made it worked ?
Currently, I can see this.
But it looks a bit weird to me.
I rather like this:
If you like this, you need this code yet.
.menu-drawer {
position: absolute;
z-index: 3;
left: 0;
top: 100%;
width: 100%;
padding: 0;
background-color: rgb(var(--color-background));
overflow-x: hidden;
filter: drop-shadow(var(--drawer-shadow-horizontal-offset) var(--drawer-shadow-vertical-offset) var(--drawer-shadow-blur-radius) rgba(var(--color-shadow), var(--drawer-shadow-opacity)));
}
I removed transform: translate(-100%); and visibility: hidden; only.
thank you so much brother it worked bundle of thanks