Why does my e-shop's top banner alignment change with screen zoom?

Shopify Discussion
1

Hi i need help with the current design of my eshop.

At 100% screen zoom, the top navigation menus and search buttons will “collapse” into 3 separate lines.

My understanding is that regardless of the screen zoom %, it should always optimize properly.

I am not sure how this happened but it only started showing up in the last 2 weeks in this manner.

I would appreciate some help on how to correct this. Thank you!

https://clippertea.com.sg/

2

HI @1872ClipperTea

Please put this code into your CSS file :-

.menu_c {
    transform: translate(-50%);
    left: 50%;
    position: absolute;
    display: inline-table;
    font-size: 12px;
    top: 22px;
    min-width: 937px !important;
    width: -moz-fit-content;
    max-width: 1505px !important;
}

after you put the code it look like this :-

deven1994_0-1660789714295.png
deven1994_0-1660789714295.png1920×1080 400 KB

3

Hi Deven, thank you for your reply. Are u able to show a printscreen of the location of the CSS editor to paste the code in. Sorry im not very well versed when it comes to scripting.

4

Hi @1872ClipperTea

please D M your store login details I will add the code for you

5

Sorry im unable to as it is a corporate biz account and i do not have the authority to do so :disappointed_face: