ISSUE STILL ONGOING: Mobile Footer Menu Dawn

[heelsluxxx]

Hi all,

I wanted to make my footer menu on mobile having all 3 menu in one row and 3 columns.

I search different solutions and I found this:

add following css your assets/base.css bottom of the file

@media screen and (min-width: 750px){
.grid--4-col-tablet .grid__item {width: calc(25% - 1rem * 3/ 4) !important;}
}

I also try this:

@media screen and (max-width: 767px){
.footer__content-top.page-width .footer__blocks-wrapper {
display: flex;
flex-wrap: wrap;
}
.footer__content-top.page-width .footer__blocks-wrapper .footer-block.grid__item {
width: 50%;
margin: 0;
}
.footer__content-top.page-width .footer__blocks-wrapper .footer-block.grid__item:nth-child(6) {
width: 100%;
}
}

and i am playing with this to find something suitable adjusting width values:

@media (max-width: 749px) {
.footer-block.footer-block--menu {
    width: 50% !important;
    display: inline-block !important;
    vertical-align: top !important;
}
}

I've done it, but nothing has changed or stay aligned. 

My store URL is https://theheelsluxxx.com/

thanks for your help

[mrashid · Accepted solution]

@heelsluxxx  add in base.css

@media screen and (max-width: 767px){
    .footer-block.grid__item {
       
        width: 30% !important;
    }
    .footer .grid {
        display: flex !important;
        align-items: baseline !important;
    }
.footer__content-top.page-width {
    padding: 0 15px !important;
}
}

[heelsluxxx]

it worded!

I accept this as solution! 

Many thanks

[OakFamily]

I had the same problem and solved it according to your method, but I had a new problem because of it, I adjusted the width scale based on yours, but the second line of the image and the introduction can't keep the same horizontal height

[OakFamily]

I had the same problem and solved it according to your method, but I had a new problem because of it, I adjusted the width scale based on yours, but the second line of the image and the introduction can't keep the same horizontal height.

[heelsluxxx]

maybe because of your store displayed settings.. did you adjust the width?

[mrashid]

please share store url @OakFamily 

[heelsluxxx]

I sorted this issue.

thus, I don't need to share my store.