Change footer layout to horizontal on mobile for Dawn theme

[andrwmai]

I'd like to change the layout of the footer on our site (Mobile view) to horizontal like the Desktop view. Currently the links are aligned vertically to the left. Is it possible to change them to horizontal and centered?

Store URL: https://ivankovatelier.com/

[andrwmai]

Here's an example: https://xlim.link/

[comercioservice · Accepted solution]

@andrwmai hi,

hope you are well,

check the list,

1, from admin, go to Online Store > Themes.

2, Actions > Edit code for your active theme.

3, Find and open the theme.liquid file, maybe in the Layout folder.

4, Look for the </head> tag and paste the code in the end

<style>
ul.footer-block__details-content.list-unstyled {
    display: flex;
    justify-content: center;
    gap: 0px 20px;
    flex-wrap: wrap;
}
</style>​

I hope it works for you, let me know, and If you'd like to discuss this more, don't hesitate to send me a PM

Thank you

[comercioservice]

@andrwmai 
result: 

Update code: 

<style>
ul.footer-block__details-content.list-unstyled {
    display: flex;
    justify-content: center;
    gap: 0px 20px;
    flex-wrap: wrap;
}

ul.footer-block__details-content.list-unstyled li a {
    line-height: 7px;
}
</style>

[andrwmai]

Hi @comercioservice, thank you for replying. Do you mean I should paste the code above the </head> tag (screenshot below)? Because it looks like the tag is at the end of the whole section.

[andrwmai]

Thank you so much. This works perfectly! Mobile view definitely looks so much better now.