• Resolved ElierBerrios

    (@elierberrios)


    Hi, the color I’m using as a primary for my page is a tone of blue, but I need the main menu (at the top) in white, inactive or in rollover … I enabled the underline in the links, but just turns blue during the rollover… I need the links in white all the time 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • Hello there,

    In order to override the default styling of the main menu on hover state, could you please try to apply the following CSS code through the Simple Custom CSS plugin or child theme’s style.css?

    #mainnav ul li a:hover{
      color: #fff;
    }
    

    Regards,
    Kharis

    Thread Starter ElierBerrios

    (@elierberrios)

    Hi, I used those lines in my child theme style.css, but the header links continue to change to blue. There will be some redundancy in my css? .. I’ll show you the contents of my child theme css:

    /* FONDO DE LA ZONA DE WIDGETS */
    .footer-widgets {
    padding: 95px 0;
    background-color: #252525;
    background: url(http://www.villaroxana.com/web2016/wp-content/uploads/2016/08/fondo_foot_widgets.png) repeat 0 0;
    }

    /* POSICIÓN MENU PRINCIPAL – “margin” define el espacio del margen derecho con respecto al contenido en este orden: margen sup, margen der, margen inf, margen izq */
    #mainnav {
    display: block;
    float: right;
    margin: 20px 50px 0 30px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    }

    /* COLOR BLANCO EN HOVER Y EFECTO SUBRAYADO EN MENU PRINCIPAL */
    #mainnav ul li a:hover {
    color: #fff;
    text-decoration: underline;
    }

    /* ELIMINAR TÍTULO POR DEFECTO EN LA HOME PAGE */
    .home .entry-header{
    display: none;
    }

    /* TAMAÑO TÍTULOS EN CONTENIDOS */
    .hentry .title-post {
    font-size: 28px;
    font-weight: 600;
    line-height: normal;
    padding-bottom: 10px;
    margin: 0;
    }

    /* ALTURA ZONA DE WIDGETS FOOTER */
    .footer-widgets {
    padding: 20px 0;
    background-color: #252525;
    }

    /* ALINEAR SOCIAL ICONS DEL WIDGET A LA IZQUIERDA O A LA DERECHA */
    .social-menu-widget {
    float: right;
    }

    Hello there,

    Please try to enable the highest priority by adding an !important declaration. Your code will look like this:

    /* COLOR BLANCO EN HOVER Y EFECTO SUBRAYADO EN MENU PRINCIPAL */
    #mainnav ul li a:hover{
       color: #fff !important;
       text-decoration: underline;
    }

    Regards,
    Kharis

    Thread Starter ElierBerrios

    (@elierberrios)

    It works!!! thanks 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Main menu – change color on rollover’ is closed to new replies.