How to change spacing between search and cart icon - Beyond Theme

[Kaijann]

Hi, so I am trying to fix the spacing between the search and cart icon since they seem a little bit too close to one another. Here is the website link.

Thanks in advance for your guys help.

[suyash1]

@Kaijann - add this css to the very end of your custome.css file and check, adjust number as per the need

.header--search{margin-right: 10px;}

[Denishamakwana]

Please add below css code at bottom of assets/custome.css file

.header–search {
margin-right:15px !important;

}
Thank you.

[oscprofessional]

Hello @Kaijann

You can try this code: it will be helpful to you

Go to the Online Store->Theme->Edit code->Assets->custome.css>Add this code at the bottom.

.header--search {
    margin-right: 10px !important;
}

[oscprofessional]

hello @Kaijann

Also, try this code: it might be helpful to you-

Go to theme → edit code → theme.liquid and put this above code before

[Alok_Kasgar]

Hi @Kaijann

I hope this solution will works. Please follow below 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 tag

@media screen and (min-width: 767x){ .header--root .header--top-row .header--left-column .header-last-column .header--search{ padding: 12px!important; } }

[GemPages]

Hi @Kaijann ,

Glad to support you today.

You can check out my suggestion below to get your concern resolved.

1. Go to Edit code on Online Store:

2. add my code above the tag on Theme.liquid:

<style>
	.header-last-column .header--search {
		margin-right: 15px !important;
	}
</style>

Hope you find my answer helpful!

Kind & Best regards,
GemPages Support Team.

[PageFly-Victor]

Hi @Kaijann

You can try this code by following these steps:

Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag

Hope this answer helps.

Best regards,

Victor | PageFly