Help with moving header icons to right (Dawn theme)

[Femmi]

Hi Community!

I am looking for some help with moving the icons (Search, Account & Cart) to right most corner. This should be fairly easy so i can have more room for the menu, but that doesn't seem to be the case. 

I have attached a screenshot of what i am trying to accomplish.

I hope someone can please help me with this?

Gracias!

Femmi

[pierrewebdev]

Hey can you send me a link to your store so I can take a closer look.
This can probably be fixed with some custom CSS (code to style the header)

[Moeed · Accepted solution]

Hey @Femmi 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
@media screen and (min-width: 768px) {
.header__icons {
    left: 200px !important;
    position: relative !important;
}
}
</style>

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[Femmi]

Hi Moeed, That did the trick, Thank you!

I have another ask though..and hoping its a small change!

I would like to change the Bag icon for checkout to a Cart icon.

Is this icon somewhere i can change? For the life of me, i am not able to locate this and really appreciate your help!!

Thanks much!

Femmi

[Moeed]

Hey @Femmi 

Yes, it is possible and it requires custom liquid coding and is not only possible through CSS. If you're not familiar with coding then I suggest to hire a Shopify developer who can help you out.

Thank you for your reply. I'm glad to hear that the solution worked well for you. If you require any more help, please don't hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.

Best Regards,

Moeed 

[azamgill]

Hey @Femmi 

Try this css

<style>
@media screen and (min-width: 990px){
.header:not(.drawer-menu).page-width {
    padding-right: 0 !important;
}
}
</style>