Remove “Select Page” Text from Mobile Menu

Last modified Dec 4, 2020
Difficulty Beginner
Language CSS

If you set your Divi Menu centered, you will see on your Mobile by default “Select Page” before your menu bar. Use this CSS snippet to hide it.

 

CSS

#et_mobile_nav_menu span.select_page {
    display:none;
}

 

Does this snippet (still) work?

Please let us know in the comments if everything worked as expected. We have tested this code with the Version: 4.0.5 of the Divi Theme.
If you think this code saved you time, we will be happy to receive a comment!

____

License: This snippet contains code from the Divi Theme, copyright https://elegantthemes.com, modified by Divi Space, November 7, 2019. Licensed under the GNU General Public License, no warranty; click here for details.

Your Comments

11 Comments

  1. Ness

    Perfect…. thank you!! I spend ages trying to get rid of that 🙂

    Reply
    • Joshua

      Glad we could help 🙂

  2. Mindee Forman

    Great code, thanks! I had issues with my hamburger menu being at the very bottom of my header, so added this code to put a bit of space:

    div#et_mobile_nav_menu {
    padding-bottom: 10px;
    }

    Reply
  3. Mindee Forman

    Thanks so much for this code! It removed “Select Page” perfectly, but it made the hamburger menu REALLY close to the bottom of my header. How would I increase the padding there by 5px or so?

    Reply
  4. Jose Vieitez

    Anna’s suggestion was very helpful, though it left the hamburger menu showing, So I also added this CSS:

    #et_mobile_nav_menu span.mobile_menu_bar {
    display:none;
    }

    Reply
  5. Morad Bensaoud

    Hi, thanks for the snippet.
    -> Probably an oversight, but this should be marked as CSS, not Javascript.

    Reply
    • Anna Kurowska

      Fixed 🙂 thank you!

  6. Jacob

    The phrase “SELECT PAGE” is removed; however, the grey background that was behind that phrase is still visible and unsightly.
    Any way to remove this too?

    Reply
    • Anna Kurowska

      Try adding this CSS:

      @media (max-width: 980px) {
          .et_header_style_centered #main-header .mobile_nav {
              background-color: transparent!important;
      }
      } 
  7. carla

    Muchas gracias!!!

    Reply

Submit a Comment

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

Receive notifications about our new blog posts.