Solved

footer: align menu to the right (dawn theme)

10xfuel
Pathfinder
130 0 13

Hi! How can I align the footer menu and language selector (red box) to the right (green box)?
website: www.10xfuel.com

10xfuel_0-1696305593089.png

 

thank you!

 

 

Accepted Solution (1)

David_SHT
Globetrotter
605 125 124

This is an accepted solution.

Hi @10xfuel ,

 

This is David at SalesHunterThemes.

You can try to follow these steps:

Go to Online Store -> Themes -> Actions -> Edit code.

Go Assets folder -> base.css file.

Add this following code at the bottom of page.

 

 

.footer-block__details-content {
    text-align: end !important;
}
.footer-block__details-content>li {
   margin: 0 !important;
}
.footer__content-bottom-wrapper {
    display: flex !important;
    flex-direction: column !important;
}
.footer__column.footer__localization {
  justify-content: end !important;
}

 

 

result:

David_SHT_0-1696306745707.png

 

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

David | SalesHunterThemes team

We create fast Shopify themes, focusing on exceptional performance and seamless experience across all devices.

Try our Electro theme Free! (Now at Black Friday price)

View solution in original post

Replies 6 (6)

Dan-From-Ryviu
Shopify Partner
7678 1493 1496

Hi @10xfuel 

Please add this code to bottom of base.css in your Online store > Themes > Edit code 

ul.footer-block__details-content { float: right !imporatant; text-align: right !important; }
.footer-block__details-content>li { margin-right: 0px !important; }
.footer__content-bottom-wrapper { flex-direction: column !important; }
.footer__localization { flex-direction: row-reverse !important; }

Screenshot 2023-10-03 at 11.11.28.png

 

- Helpful? Like or Accept solution! or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

David_SHT
Globetrotter
605 125 124

This is an accepted solution.

Hi @10xfuel ,

 

This is David at SalesHunterThemes.

You can try to follow these steps:

Go to Online Store -> Themes -> Actions -> Edit code.

Go Assets folder -> base.css file.

Add this following code at the bottom of page.

 

 

.footer-block__details-content {
    text-align: end !important;
}
.footer-block__details-content>li {
   margin: 0 !important;
}
.footer__content-bottom-wrapper {
    display: flex !important;
    flex-direction: column !important;
}
.footer__column.footer__localization {
  justify-content: end !important;
}

 

 

result:

David_SHT_0-1696306745707.png

 

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

David | SalesHunterThemes team

We create fast Shopify themes, focusing on exceptional performance and seamless experience across all devices.

Try our Electro theme Free! (Now at Black Friday price)

10xfuel
Pathfinder
130 0 13

I entered the code but nothing happened - what did I do wrong?

10xfuel_0-1696306928380.png

 

10xfuel
Pathfinder
130 0 13

the "language selector" moved  - the menu not:

10xfuel_1-1696307026773.png

 

David_SHT
Globetrotter
605 125 124

Let me check

We create fast Shopify themes, focusing on exceptional performance and seamless experience across all devices.

Try our Electro theme Free! (Now at Black Friday price)

SAN_MSWEB
Shopify Expert
1082 130 136

Hi @10xfuel 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the base.css file:

.footer-block__details-content {display: flex !important; flex-direction: column !important; align-items: end !important;}

.footer__content-top {padding-bottom: 2rem !important;}

.footer__content-bottom {padding-top: 1rem !important;}

 

 

 

Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin