Is it possible to change footer menu from list to grid on mobile devices?

I am trying to move the footer menu links from being listed horizontally, to being listed vertically as a grid. I was able to accomplish this for screens min width 750px, but not for max width 749px.

Any help is appreciated.

Hello @TAO3 ,

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

Add this following code at the bottom of page

@media screen and (max-width: 749px) {
  .footer-menu-class {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 10px;
  }
}

Save changes

Hope this can help.

Ali Reviews team.

Thank you for your response, Ali!

Unfortunately, it didn’t work.