WordPress.org

Ready to get started?Download WordPress

Forums

Highwind
Menu bar disappears when I hover on it (10 posts)

  1. T Can
    Member
    Posted 12 months ago #

    The menu bar disappears when I hover on it.

    The menu bar changes to the same colour as the background and same colour as the links when I hover on it so it looks like the words disappear.

    I want to stop the colour from changing at all or to make it black.

    What code do I add to do this.

    Thanks for all your support during this painful process the website will go live on the weekend so trying to get this all done .

    http://www.mrsgreenjeansplantsseeds.com

  2. Abinav Thakuri
    Member
    Posted 12 months ago #

    Open header and find this line:

    .main-nav ul.menu ul, .main-nav ul.menu > li:hover > a, .main-nav ul.menu > li > a:hover { background:#00cd66; }

    Change #00cd66 to #000000 which should change it to black.

  3. T Can
    Member
    Posted 12 months ago #

    I found this in the style css

    .main-nav ul.menu li:hover > ul {
    filter: alpha(opacity=@opacity * 100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    overflow: visible;
    visibility: visible;
    -webkit-transform: translateY(0);

    Is this were I change it?

  4. Abinav Thakuri
    Member
    Posted 12 months ago #

    Nope I think you can find this in header.php .

  5. T Can
    Member
    Posted 12 months ago #

    not in the header.php

    it says in header

    <?php
    /**
     * The header template.
     * @package highwind
     * @since 1.0
     */
    ?>
    <?php if ( ! defined( 'ABSPATH' ) ) exit; // Exit if accessed directly ?><?php highwind_html_before(); ?><!doctype html><!--[if lt IE 7 ]> <html <?php language_attributes(); ?> class="no-js ie6"> <![endif]-->
    <!--[if IE 7 ]>    <html <?php language_attributes(); ?> class="no-js ie7"> <![endif]-->
    <!--[if IE 8 ]>    <html <?php language_attributes(); ?> class="no-js ie8"> <![endif]-->
    <!--[if IE 9 ]>    <html <?php language_attributes(); ?> class="no-js ie9"> <![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--> <html <?php language_attributes(); ?> class="no-js"> <!--<![endif]-->
    <head>
    
    	<?php highwind_head_top(); ?>
    
    	<meta charset="<?php bloginfo( 'charset' ); ?>" />
    
    	<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
    	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    
    	<title><?php wp_title( '/', true, 'right' ); ?></title>
    
    	<!--  Mobile viewport optimized: j.mp/bplateviewport -->
    	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    
    	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
    
    	<?php highwind_head_bottom(); ?>
    
    	<?php wp_head(); ?>
    
    </head>
    
    <body <?php body_class(); ?>>
    
    <?php highwind_body_top(); ?>
    
    <div class="outer-wrap" id="top">
    
    	<div class="inner-wrap">
    
    	<?php highwind_header_before(); ?>
    
    	<header class="header content-wrapper" role="banner" style="background-image:url(<?php echo header_image(); ?>);">
    
    		<?php highwind_header(); ?>
    
    	</header>
    
    	<div class="content-wrapper">
    
    	<?php highwind_header_after(); ?>
  6. WPyogi
    Volunteer Moderator
    Posted 12 months ago #

    CSS is not in the header.php file - it may show up in the generated HTML in the header - in the Custom CSS -

    <!--Customizer CSS-->
            <style type="text/css">
    ...
            </style>
            <!--/Customizer CSS-->

    But that's not where you would change it.

  7. T Can
    Member
    Posted 12 months ago #

    HUH???? = Newbie here and now I don't know what you said.

    Please explain. I have a child theme style.css. But I cannot find what the other person said and now dont know what wpyogi said either.

  8. Abinav Thakuri
    Member
    Posted 12 months ago #

    Well in that case, you can just add this as it is in your style.css file:

    .main-nav ul.menu ul, .main-nav ul.menu > li:hover > a, .main-nav ul.menu > li > a:hover { background:#000000!important; }

  9. T Can
    Member
    Posted 12 months ago #

    Nope that code did not work. I put it in my child style.css

  10. WPyogi
    Volunteer Moderator
    Posted 12 months ago #

    The code in the header is likely from a custom CSS plugin? Or does your theme have custom CSS in it?

    What you added has some errors in it because the "greater than" signs got messed up - remove that last piece of CSS and try adding this instead:

    .main-nav .highwind-navigation ul.menu a:hover {
      color: black;
    }

Reply

You must log in to post.

About this Theme

About this Topic

Tags