Header options & logo

[system]

Hi guys, I want to reduce the white gap between my logo & header options slightly and also move the search bubble from the left top corner to the right top corner and place it next to the cart button.

Can you please help me with this?

url: Hygiadental.com
pw: Angel

Thankyou in advance!

[Tech_Coding]

Hello @Anonymous

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

@media screen and (min-width: 990px) { .header:not(.header--middle-left,.header--middle-center) .header__inline-menu { margin-top: -0.95rem !important; } .header>.header__search { position: absolute; right: 100px; top: 13px; } }

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

[Vinsinfo]

@Anonymous Please follow below steps to reduce the space between the logo and menu. Let me know whether it is helpful for you.

1. From admin go to “Online Store” → “Themes”.
2. Click “Edit code” button from the current theme.
3. Go to “base.css” file.
4. Then paste the below code at the bottom of the file and then save changes.

.header__heading-link { padding-bottom: 0px; }
.header:not(.header--middle-left, .header--middle-center) .header__inline-menu { margin-top: 0px; }

Result will be like,

Please provide your support by click “Like” and “Accepted” if our solution works for you. Thanks for your support.

[GTLOfficial]

Hello @Anonymous
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

@media screen and (min-width: 990px) {
.header__search {
position: fixed;
right: 160px !important;
top: 55px !important;
}
.header:not(.header--middle-left, .header--middle-center) .header__inline-menu {
margin-top: -1rem !important;
}
}

result

If this was helpful, hit the like button and accept the solution.
Thanks

[system]

Hi, I thought this was a solution though this is the outcome when you click it and scroll down.

[system]

Thank you for this, I have used the code and had to change some code to right: 150px;
top: 15px;.

It looks good though when I click on the search bar I have this pop up instead of something clean, How do I fix this?