How to move social icons closer to profile and cart icon on Dawn?

[hasanali1]

hi all , i want to move the social media icons closer to profile and cart icon

without affecting the footer social media icons

any help is appreciated !

https://marthajewelry.myshopify.com/

password - test

[infoatcodelab7]

Hello @hasanali1

To move social media icon closer to account icon follow this steps :

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > section-footer.css and paste this at the bottom of the file:

.footer__list-social.list-unstyled.list-social{
  left: unset !important;
}

Hope this works well.

[Moeed]

Hey @hasanali1

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

[saim007]

Hello @hasanali1 For removing space you have to do simple thing.

Go to Online Store > Edit Code > click and open Section-footer.css file and find this class name .footer__list-social.list-unstyled.list-social and you will see css like left: -23px just replace with left: 0px; That’s it!

I hope it will work for you!

[StoreWatchers]

Hi @hasanali1

Greetings from the Store Watchers Support Team! Happy to help you today.

To move the social media icons closer to profile and cart icon without affecting the footer social media icons, please follow the below steps.

Online Store ->Theme ->Edit code → Assets ->base.css

add the following code at the end of the file

header .footer__list-social.list-unstyled.list-social {
    left: 0.5rem !important;
}

You can change the 0.5 value as per your need.

After applying the code it will look like this

Hope this will help you, Let me know if need any help!

Regards,
Store Watchers Support Team

[websensepro]

Hi @hasanali1

1. Go to the online store

2. Edit the code file: section-footer.css paste the code

.footer__list-social.list-unstyled.list-social {
position: relative;
left:1rem;

}

[Alok_Kasgar]

@hasanali1

I hope this solution will works. feel free to text me back if you have any question.
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 (min-width:768px) { .header__icons .footer__list-social.list-unstyled.list-social{ left: 0.7rem; } }

[hasanali1]

hi, this worked but it affected the footer icons

can we align to be on side with the links above

[Ujjaval]

@hasanali1 Change the header social media class so it not got affect to the footer social media icon
header__list-social list-unstyled list-social