Source: https://www.elegantthemes.com/forum/viewtopic.php?f=187&t=544323

If the menu doesn’t fit because of too many menu items in the navigation or a desktop font size that is too big, the menu wraps to two lines on ipad landscape.

Use the below CSS to fix and change values as needed.

Notes:

• Use px units for a fixed sizes or vw for responsive sizes.
• The menu switches to mobile layout with the hamburger icon from 980vw and below.

/** START navigation menu smaller font size and gap on small screens **/
@media only screen and (min-width: 981px) and (max-width: 1365px) {
#top-menu li a {
font-size: 1.5vw !important;
}
.et-fixed-header #top-menu li a {
font-size: 1.5vw !important;
}
#top-menu li {
padding-right: 10px !important;
}
}
/** END navigation menu smaller font size and gap on small screens **/Code language: CSS (css)

And make the menu 100% of the screen

https://quiroz.co/a-better-responsive-divi-menu-for-desktops-and-laptops-with-smaller-screens/

/* START wider navigation menu on small screens */
@media only screen and (max-width : 1200px) {
.container.clearfix.et_menu_container, #top-header
.container.clearfix {
max-width: 100%!important;
width: 95%!important;}
}
/* END wider navigation menu on small screens */Code language: CSS (css)

And with the theme builder menu

/* -- START Fix menu sizing on small screens -- */
@media only screen and (min-width: 981px) and (max-width: 1500px) {
.et_pb_menu .et-menu>li {
    padding-left: 0 !important;
    padding-right: 1.3vw !important;
}
.et_pb_menu_0_tb_header.et_pb_menu ul li a {
    font-size: 1.3vw !important;
}
}
/* -- END Fix menu sizing on small screens -- */Code language: CSS (css)