Need help? Check out our Support site, then


Text color in navigation bar help

  1. hyacinthgirlbeauty
    Member

    I'm using the Pachyderm theme. I am very new to CSS and have done what I thought would change the colour of the text in the navigation bar but when I visit the site the text is white (and thus invisible).

    I would like to keep my navigation/menu bar white, and the text be #515151. I would like the hover bg colour to be the purple it is currently, and thus the hover text colour to be white (this part is working at the moment). I don't want the active page title to have a different bg.

    The blog I need help with is hyacinthgirl.com.

  2. To change menu colors in the Pachyderm theme, start with this example and adjust the color codes as needed:

    .navigation-main {
    	background: #fff;
    }
    .navigation-main a,
    .navigation-main a:visited {
    	background: #8155cd;
    	color: #fff;
    }
    .navigation-main li:hover > a,
    .navigation-main ul ul :hover > a,
    .navigation-main ul ul a:hover {
    	background: #6636b9;
    	color: #fff;
    }
    .navigation-main li.current_page_item a,
    .navigation-main li.current-menu-item a {
    	background: rgba(255,255,255,.3);
    	color: #515151;
    }
    .navigation-main li.current_page_item ul a,
    .navigation-main li.current-menu-item ul a {
    	background: #8155cd;
    }
    @media screen and (max-width: 600px) {
    	.menu-toggle {
    		background: #8155cd;
    		color: #fff;
    	}
    }

    Note that this example tries to be comprehensive for menu colors. The last block controls the color for menus in Pachyderm on mobile devices.

Topic Closed

This topic has been closed to new replies.

About this Topic