How do I put my header icons closer together? See Pics

Store Design
, ,
1

Hi, I’m trying to get my header icons closer together like the photo below. How do I do this? I’m using Dawn default theme.

MYICONS.PNG

MYICONS2.PNG

(To the left is mine) (The right is what spacing I want my icons to have)

Here is my store:

https://black-bee-1.myshopify.com/

Password: giaske

Here is the example store that has the icons I want:

https://luxe-vibes-white.myshopify.com/

password: dreamshack

2

Hi @kirstenlc5 ,

Please add the below line of code at the end of your base.css file. You can find this file in assets folder of your theme.

body .list-social__link{
padding:8px;
}
body .header__icon,body .header__icon--cart .icon{
height: 3.4rem;
width: 3.4rem;
}

Let me know if you face any issue.

3

Hello @kirstenlc5 ,

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:

GemPages_0-1672209578322.png
GemPages_0-1672209578322.png399×194 24.3 KB

  1. Add my code above the tag on file Theme.liquid:

I hope you find the answer helpful.

Kind & Best regards,
GemPages Support Team.

4

Thank you, it did work for the social media icons but not the account and cart icon. What should I do?

yes83837.PNG

5

v7.PNG

Thank you, it made them a little closer together, but the cart icon is too small now. What should I do?