different size of tablet

[Anton]

Hello!
How can i change the point when mobile menu will be on from default 992px to custom one that i need? Looking forward to your reply

[Zex]

Hello, Anton!

You have not written whether you want to change it on larger screens or smaller ones.

In any case, I do not recommend changing it on smaller screens then 992px, as your menu will be difficult to read.

If you would like to display your mobile menu earlier than 992 px, insert the following codes into
Customizing->General->Additional CSS:

@media screen and (max-width: 1100px){
#site-navigation, #top-bar-wrap, .sticky-header nav {
    display: none!important;
}
.mobile-menu-icons {
    display: block!important;
    line-height: 87px;
}
    .mobile-menu-icons li {
    display: inline-block!important;
}
    .mobile-menu-icons .cart_count:before {
    border-color: transparent #a2c605 transparent;
    border-style: solid solid solid none;
    border-width: 5px 5px 5px medium;
    content: "";
    height: 0;
    left: -3px;
    margin-top: 5px;
    position: absolute;
    top: 0;
    width: 0;
}
    .mobile-menu-icons .cart_count {
    display: inline-block!important;
    text-align: center;
    font-size: 12px;
    line-height: 20px;
    position: relative;
    font-weight: 600;
    right: 0;
    background: #a2c605;
    width: 20px;
    height: 20px;
    color: #fff;
    z-index: 10000;
    border-radius: 2px;
    top: -3px;
}
    mobile-menu-icons li {
    padding-right: 5px;
}
    .mobile-menu-icons .shopping_cart:before {
    font-family: 'FontAwesome';
    font-size: 19px !important;
    content: '\f291';
    position: relative;
    right: 5px;
}
}

Change the max-width value in the very top line according to your needs.

Greetings

[Author]

Posts