Multiple Color Changes and Font Change

  • Unknown's avatar
    brian4villagepresident · Member ·

    I am currently working with the Digg 3 Column theme, which is perfect for my application. However, I would like to change the color of the tabs and also the font and color of the main header box. This is for a political campaign, so red white and blue would be good colors to go with. I would like to change the blue to a navy blue, and the tabs to a dark red with either white or navy blue letters. I have previewed a border that somehow got added that I also need to either incorporate somehow or delete.

    I have been toying around with this for over 2 hours now, and really can’t figure this out. I’ve searched support, read similar posts in the forums, and am still smack-dab in the middle of nowhere.

    Any help is greatly appreciated (so is some OTC pain reliever for the headache I am getting)!

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    brian4villagepresident · Member ·

    P.S. blog is
    http://brian4villagepresident.com

    Thanks again!

  • Unknown's avatar
    thesacredpath · Member ·

    The navigation tabs consist of two images which you will have to recreate in exact dimensions if you want to replace them and have them look similar. After creating those two image, then you have to replace the existing relative URLs with the new absolute URLs.

    http://s1.wp.com/wp-content/themes/pub/digg3/images/bg_tab_left.gif
    http://s1.wp.com/wp-content/themes/pub/digg3/images/bg_tab_right.gif

    One of the URLs goes here, ” #menu ul li a ” and the other one goes here ” #menu ul li “.

    Put the following into your CSS edit window at the bottom of whatever you have in there and take a look via the preview. It creates the tabs in red with a white rounded border with white text and the text turns blue on hover.

    #menu ul li {
background: none no-repeat scroll right top #FF0000;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border: 2px solid #FFFFFF;
}

#menu ul li a {
background: none no-repeat scroll right top transparent;
color: #FFFFFF;
}

#menu ul li a:hover {
color: #111869;
}

    I went with white text since blue on red fights and is very difficult to read (low contrast).

  • The topic ‘Multiple Color Changes and Font Change’ is closed to new replies.