Hi All,
For some reason, when I change two particular drop down menu’s the alignment goes skewed but the rest stay the same.
I’m not sure why, pictures attached below. Website - www.luxurybrandjewellery.com.au
Appreciate any help! Thanks in advance!
Topic summary
Main issue: Two specific dropdown menus in the Shopify Debut theme become misaligned when modified, while other menus remain aligned. The website link and multiple screenshots are provided to illustrate the skewed alignment.
Update: A responder reports the menus look correctly aligned, supported by their screenshots. However, their browser appears zoomed in, which may conceal the misalignment seen at other zoom levels.
Key insight: The alignment appears dependent on screen size or viewport width. At wider viewports or when zoomed out, the dropdowns shift, suggesting a responsiveness/layout issue in the navigation bar.
Request: Guidance on making the dropdown menus automatically adjust to different visitor screen sizes (responsive behavior). The original poster asks others to test by zooming out to replicate the issue.
Context notes: Debut is Shopify’s default theme; dropdown menus are navigation UI elements; responsiveness means adapting layout across screen sizes.
Status: No concrete fix or code changes shared yet. The discussion remains open with the unresolved question of implementing responsive alignment for the dropdown menus.
Media: Screenshots are central to understanding how alignment varies with zoom and viewport.
Hi @Ujjaval ,
thanks for your reply, i can see in your screenshots that you have the page zoomed in? As in my screenshots it is zoomed out.
could this be affecting it?
Hi @Ujjaval ,
It must be something to do with the menu / nagivation bar only being aligned with a certain size screen or width.
Is there something I can do so that it automatically adjusts the dropdown menu depending on each visitors screen size?
Perhaps if you zoom out on your screen, you will be able to see?
thanks!