Mobile device menus not showing

  • Hi,

    I’m using the responsive theme by cyberchimps for my website. I recently added some code to the child style.css file to change the colours of the menu to something I was more happy with, and also increased the font on the menus a little. This worked fine and showed great when used on a computer, but when I used a mobile I noticed the changes hadn’t come through, and worse than this, now the menus, apart from the first menu, were not showing.

    If I delete the code I added, the menus work fine. Does anyone know how I can fix this? The code I have used to change the menus is as follows:

    /*This will change the menu background color*/ .menu 

{ background-color: #4d3c29; background-image: none; 

}

/*This will change hover color*/ .menu a:hover { background-color: #4d3c29; background-image: none; }

/*This will change Font color and size*/ .menu a:hover { color: #f8b750 !important; font-size: 15px; }

/*This will change Font color and size*/ .menu a { color: #ffffff !important; font-size: 15px; }

.menu .current-menu-item a {
background-color: #4d3c29; }

.menu .current-menu-item a { color: #f8b750 !important; font-size: 15px; }

    Many thanks

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

  • use css media query

    for mobile something like this 

    @media only screen and (max-width: 768px) {
    /* class For mobile phones: */

}

    for desktop

    @media only screen and (min-width: 768px) {
    /* For desktop: */

}

    Thread Starter flyinjam

    (@flyinjam)

    Thanks Zota, but this doesn’t seem to work? The mobile site uses a drop down menu, whereas the desktop site uses a normal menu. I don’t know if this makes any difference? I wouldn’t mind if the mobile menu was just the normal settings to be honest, but obviously it would look better if the colours match the desktop site.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Mobile device menus not showing’ is closed to new replies.