Mobile menu order is not the same as desktop menu order

it’s not WordPress menu issue, you should look into your theme.
It’s look like that your theme is using different menu for mobile and desktop.

It has to do with the flexbox somewhere the column direction is being reversed.
You can try adding the code below to see if it fixes it. If you go the customizer and look toward the bottom there an option for additional css. Try entering the code in this section. If it doesn’t work just remove it.

@media only screen and (max-width: 900px){
.ast-header-break-point .ast-mobile-header-wrap .ast-flex.stack-on-mobile {
  flex-direction: column-reverse;
}

}

Thank you for your response. While that did work in flipping the order of the menu which is helpful for the future. It still doesn’t make it in the same order as in the desktop view which is (home, portfolio, about, contact). The mobile stack turns into (about, contact, home, portfolio). Once I added the CSS it changed to (portfolio, home, contact, about). I think it has to do with stacking the second desired link on top of the first one do to the width being so small. Instead of being in a column of (1,2,3,4) it is in (3,4,1,2)

WIth the help of css you can fix this like
@media (max-width:575.98px){
ul.main-header-menu.ast-nav-menu.ast-flex.submenu-with-border.astra-menu-animation-fade.stack-on-mobile{display:flex;flex-flow:column;}
li.page_item.page-item-79.menu-item{order:2;}
li.page_item.page-item-68.menu-item{order:1;}
li.page_item.page-item-86.menu-item{order:4;}
li.page_item.page-item-84.menu-item{order:3;}
}
https://www.awesomescreenshot.com/image/12564341?key=647ec9ba67b2473fddcb84efd5fc02bb

• This reply was modified 3 years, 6 months ago by yogeshyadav20.

Thank you! This worked well. After looking at your CSS I also found a second way for people who might have the same problem. If you go to each page and click on “quick edit” you will see a order normally set to 0. There you have to put the order number you wish that page to have.