Hi, I’m having a problem with the categories of my website. when I click on “beauty” for example. if you see the picture you’ll understand the problem. yesterday everything was okay. maybe I touched something I dunno. 
Sorry for the photo quality
Topic summary
Mega menu categories displayed incorrectly when clicking items like “Beauty”; the submenu appeared misaligned. Images were shared to illustrate the issue.
Identified as a CSS positioning problem: the submenu element (.site-nav.style–classic .submenu) was forced with left: 0, causing it to anchor to the left.
Fix implemented by editing section-header.css:
- Online Store > Themes > Edit code
- Open section-header.css
- In .site-nav.style–classic .submenu, remove/comment left: 0; and add left: unset;
Explanation: The CSS left property controls horizontal positioning; unset resets it to the default/inherited state, allowing the submenu to align properly.
Outcome: The original poster confirmed the issue is solved. A YouTube tutorial link was later shared, but no further action was needed.
Status: Resolved; no open questions. Images were central to understanding the misalignment and the corrected output.
Hello @vivvy1522 , This is a CSS problem. it is getting left:0; the property of that div. Please follow the steps below.
- Go to your Online Store
- Click on “Themes”
- Select “Edit code”
- Open your “section-header.css” CSS file.
- Find below CSS and a new CSS.
.site-nav.style--classic .submenu {
background: transparent;
position: absolute;
left: 0; /* remove or comment CSS line */
left: unset; /* add this new CSS line */
opacity: 0;
visibility: hidden;
transition: opacity .1s linear 40ms, visibility .1s linear 40ms;
padding-top: calc(var(--header-vertical-space) / 2);
margin-top: .0625rem;
}
See the output below,
Feel free to reach out if you have any questions or need assistance.
Best regards,
Darshan.
Thank you so much! now it’s solved 
