Footer. Refresh Theme. Make Footer Navigation Wider

Hi all. Is it possible to make the navigation in the footer go closer to the edge of the pages than it currently does? Not sure why that’s not an option. Also, is it possible to center the navigation in the footer on mobile view? My website is www.PennsylvaniaParks.org. Thanks in advance :slightly_smiling_face:

Hi @Justin34

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

.footer-block:only-child:last-child {
    max-width: 100% !important;
}

Hope you find my answer helpful!

Best regards,

Richard | PageFly

1 Like

Hello @Justin34 ,

to make the navigation in the footer go closer to the edge of the pages. You can try to follow these steps:

Go to Online Store → Themes → Actions → Edit code

Go to Assets folder → base.css file or theme.scss.liquid file

.footer-navigation-container {
  padding: 0;
}

To center the navigation in the footer on mobile view, you can add this code below

@media screen and (max-width: 767px) {
  .footer-navigation {
    text-align: center;
  }
}

Save and preview

Hope this can help.

Transcy

Worked perfect… Thanks! Is there a way to center the footer navigation on mobile pages? Thanks so much in advance.

you can try this code

@media(max-width: 767px) {
  .footer-navigation {
    text-align: center !@important;
  }
}