Header Menu and Insert Tel Icon on the header

Hi there,

Something like this?:

.main-nav > ul {
    display: flex;
}

.main-nav li {
    order: 2;
}

li.slideout-toggle {
    order: 1;
}

li.wc-menu-item {
    margin-left: auto;
}

You might want to run it through this tool if you need older browser compatibility: https://autoprefixer.github.io/

As for adding icons, perhaps a plugin like this will help?: https://wordpress.org/plugins/menu-icons/

Hi Tom, Thank you for helping me out on this one it was such a great help. I used the code you have sent me and it works fine unfortunately for the tablet and Mobile view it causes some issues. The menus is creating duplicates and the cart as well

This is what I used on the Additional CSS from the template.

.main-nav > ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

.main-nav li {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}

li.slideout-toggle {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}

li.wc-menu-item {
margin-left: auto;
}

Hi there,

I checked the link you provided, and i cannot see this? The top and bottom navigations are both Elementor. Can you confirm where i should be looking :)