How to realign footer view in mobile?

[Motoblox]

My mobile view for the footer section is like this right now- 

I need the quick link's to be side to side in one line and the email part to come first, can anyone help me do this please?

[akshay_bhatt]

Hi @Motoblox ,

Here’s how you can achieve that in your Modular theme:

1. Edit Footer in Theme Settings:

   • Navigate to Online Store > Themes > Customize.
   • Go to the Footer section and look for settings related to the "Quick Links" and "Email" sections. Check if you can reorder or adjust the layout there.

2. Add Custom CSS for Mobile View: If the theme doesn’t have a built-in option for this, you can use custom CSS to tweak the layout on mobile. Here's some CSS that could help:

/* Custom CSS to adjust footer layout */
@media only screen and (max-width: 767px) {
    .footer .quick-links {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .footer .quick-links a {
        margin-right: 15px; /* Adjust spacing between links */
    }

    .footer .email-section {
        order: -1; /* Moves the email section to the first position */
        margin-bottom: 15px; /* Adds spacing below the email section */
    }
}

• To add this:

  • Go to Online Store > Themes > Customize.
  • Click on Theme Settings > Custom CSS (or find a place to insert custom code).
  • Paste the CSS code into the section and save.
  • Verify on Mobile: After saving the changes, make sure to test it on mobile. You should see the quick links displayed side by side, and the email section should come first.

Got it! If you found my suggestions helpful, please consider liking or marking it as a solution.
Your feedback is appreciated! If you have any more questions or need further assistance, just let me know.

Thanks & Regards
Akshay Bhatt

[Motoblox]

Hi where should i place the custom code in?

I am using dawn theme

[akshay_bhatt]

everything is discribed step by step

[Motoblox]

Sorry i dont get it like where should i paste the code?