StoreX Theme Tutorials

Print

Menu and cart icons misaligned on mobile devices

This is a very common problem, and it looks like this:

To fix this problem please navigate through you site files using your favorite FTP client to wp-content/plugins/wr-megamenu/assets/css/frontend.css , open the file, comment the width: 100%; css rule on line 516 and save changes to the file on server. Commenting the line means simply putting it between the /* and */ marks.

So before commenting that part of code should look like this:


@media only screen and (max-width: 768px), (max-device-width: 768px) {
    .row [class*="col-md-"] {
        width: 100%;
        margin: 0;
    }
}

and after commenting it should look like this:


@media only screen and (max-width: 768px), (max-device-width: 768px) {
    .row [class*="col-md-"] {
        /*width: 100%;*/
        margin: 0;
    }
}

After you implement this solution icons in your mobile header are going to look the way they should:

Leave a Reply

Your email address will not be published. Required fields are marked *