Title: iphone menu
Last modified: August 20, 2016

---

# iphone menu

 *  Resolved [GeorgiaG](https://wordpress.org/support/users/georgiag/)
 * (@georgiag)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/)
 * Hi there. I am wondering what I would manage in the css to adjust the color of
   just the menubar/drop down on the iPhone. And also how I can add the word Menu
   to it in the closed state. Thank you. Georgia

Viewing 9 replies - 1 through 9 (of 9 total)

 *  [Andrew Nevins](https://wordpress.org/support/users/anevins/)
 * (@anevins)
 * WCLDN 2018 Contributor | Volunteer support
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498158)
 * Do you have a section of the dashboard named, “Custom CSS”, “Custom Styles” or“
   Jetpack”?
 *  Thread Starter [GeorgiaG](https://wordpress.org/support/users/georgiag/)
 * (@georgiag)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498222)
 * I have access to css.
 *  [Styled Themes](https://wordpress.org/support/users/gejay/)
 * (@gejay)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498263)
 * For the mobile menu styling, you will find this in the theme’s menu.css file 
   located in the css folder of the theme.
 * You will want to look for the styles that are in the lower part of the file where
   it starts with this:
 *     ```
       /* mobile menu styling */
       @media (max-width: 979px) {
       ```
   
 * Background colour and other colours are there. Make sure for any styles with 
   the !important added to the end, this stays intact because it’s needed.
 *  [Styled Themes](https://wordpress.org/support/users/gejay/)
 * (@gejay)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498267)
 * For the “adding the Menu” word in the closed state, this will require editing
   the header.php file (which I recommend doing the child theme method to make modifications
   to the theme main files). Replace this:
 * <span class=”icon-bar”></span>
    <span class=”icon-bar”></span> <span class=”icon-
   bar”></span>
 * With this:
 * <span>Menu</span>
 * Then to edit the style (which by default is the colour of white), in the child
   theme’s style.css under the part for ” Add your Bootstrap.css changes here “,
   you will add this:
 *     ```
       .navbar .btn-navbar {
                       color:#656565;
                       -webkit-box-shadow: none;
                       -moz-box-shadow: none;
                       box-shadow: none;
       }
       ```
   
 *  Thread Starter [GeorgiaG](https://wordpress.org/support/users/georgiag/)
 * (@georgiag)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498303)
 * Thank you. I will try this out! I appreciate your help.
 *  [Styled Themes](https://wordpress.org/support/users/gejay/)
 * (@gejay)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498304)
 * You’re very welcome… let me know how it works out.
 *  [Styled Themes](https://wordpress.org/support/users/gejay/)
 * (@gejay)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498380)
 * Hi GeorgiaG…. I wanted to follow up to see how things went with the change to
   the mobile menu?
 *  Thread Starter [GeorgiaG](https://wordpress.org/support/users/georgiag/)
 * (@georgiag)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498389)
 * This worked great. I used the following so the closed and hover state would be
   affected
 * a.btn.btn-navbar {
    background:#444444; color:#e0d99f; -webkit-box-shadow: none;-
   moz-box-shadow: none; box-shadow: none; }
 * .navbar .btn-navbar:hover, .navbar .btn-navbar.active {
    color: #ad912b; background:#
   222222; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
 * For some reason the header code showed the characters for <span></span> but it
   was fine when I just put it into words. We must be on different type of server
   or something.
 * Thank you again and BTW, I think the way your handled your iPhone menu drop-down
   is very elegant.
 *  [Styled Themes](https://wordpress.org/support/users/gejay/)
 * (@gejay)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498392)
 * You’re very welcome…definitely worth 1000 stars rating 🙂
    lol…just kidding. 
   But glad you got it to work.

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘iphone menu’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/celestial-lite/3.5.8/screenshot.
   png)
 * Celestial - Lite
 * [Support Threads](https://wordpress.org/support/theme/celestial-lite/)
 * [Active Topics](https://wordpress.org/support/theme/celestial-lite/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/celestial-lite/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/celestial-lite/reviews/)

## Tags

 * [iphone](https://wordpress.org/support/topic-tag/iphone/)
 * [menu](https://wordpress.org/support/topic-tag/menu/)
 * [menu label](https://wordpress.org/support/topic-tag/menu-label/)

 * 9 replies
 * 3 participants
 * Last reply from: [Styled Themes](https://wordpress.org/support/users/gejay/)
 * Last activity: [13 years, 3 months ago](https://wordpress.org/support/topic/iphone-menu/#post-3498392)
 * Status: resolved