HORIZONTAL FOOTER - DAWN THEME

[ecom_newb]

Hi! I searched through every single solved post containing the words "horizontal footer dawn" and could not find an answer 😞 hopefully, I'll have some luck here...

I currently have "dawn" theme installed on my page:

https://showerbeats.com/

Links in the footer are currently vertical:

I'd LOVE for them to be listed horizontally like:

Any solution or guidance would be greatly appreciated!
Thank you in advance 🙂

[oscprofessional]

Hi @ecom_newb ,

I have checked your store there is different layout on your page instead of you shared screenshot. There is 4 section of 25% width. 

You need to change the layout. for horizontal. check theme customization section is there any option to change layout or you have to do code customization. It is a time consuming work. 

If you wish we can do it. 

Contact us via email or Skype.

Thanks.

[ecom_newb]

Thanks for the feedback, @oscprofessional.

I have since changed the layout of the homepage.

I have dawn theme installed but I used pagefly to create the page.

I currently have my footer in 4 sections

Not really what I was aiming for but I'm much happier with this layout on DESKTOP.

However... the links are in one column on MOBILE version.

Do you have a solution for MOBILE version... to arrange columns horizontally instead of stacked?

[oscprofessional]

Hi @ecom_newb ,

If you want like this 

use this css

.footer-block.grid__item.footer-block--menu {
    margin: 0;
    max-width: 33% !important;
    padding: 0;
    display: table-cell;
}

Add this css in media 749px only...

[ecom_newb]

@oscprofessional thank you for the assistance!

I am having difficulty finding where exactly to place it.
Which section and/or line would I insert this?

[oscprofessional]

@ecom_newb ,

Add this css in

Online Store->Theme->Edit code->Assets->base.scss.liquid

Note : find media query @media screen and (min-width: 749px)

add under this media only !

[ecom_newb]

@oscprofessional,

I added the code to line 216-221 in base.css but it looks like this on my mobile 😕😕

[oscprofessional]

Hi @ecom_newb ,

still you are having issue ?

Sorry for the late response.

[GlowRope]

Hi @oscprofessional, Iam after the same thing for my store however after I add the code under the @media screen and (min-width: 749px) query it still isnt working. Would you mind having a look for a solution for me please?

www.glowrope.com.au

password: welcome