Help with Black Letterhead

  • Author
    Posts
  • #159284

    sketchygirl
    Member

    So I’m one of the morons who decided to upgrade without being adept at CSS (1 section on it in college…5 years ago)

    Anyway, I started out with the Black Letterhead template because I thought it looked closest to what I’m ultimately going for. I’ve hashed out at least the very basics, but the hovering has got me stumped.

    Basically all the websites I’ve checked for tutorials tell me to do this:
    A:visited {color: #FFBF00; text-decoration: none}
    A:link {color: #FFFF00; text-decoration: none}
    A:active {color: #C0FFC0; text-decoration: none}
    A:hover {cursor: crosshair; color: #C0FFC0; background-color: lightslategray; text-decoration: none}

    But the stuff I’m trying to change looks like this:
    h1, h1 a, h1 a:hover, h1 a:visited, .description {
    text-decoration: none;
    color: #FD5A1E;
    }

    h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
    color: #E4D3A6;
    }

    h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
    text-decoration: none;
    }

    I’m just going through this stuff bit by bit, doing things trial and error. Please excuse me if this is a really dumb question. I just can’t get rid of the “orange” that is embedded in the template somehow.

    Please take a look and tell me how far off i am.

    Thanks.

    #159507

    trent
    Member

    Not 100% sure as I don’t use this theme and haven’t memorized the color scale, but I think the problem child would be the following if you are talking about the links:

    a, h2 a:hover, h3 a:hover {
            color: #FD5A1E;
    	text-decoration: none;
    	}
    
    a:hover {
    	color: #707070;
    	text-decoration: underline;
    	}

    Trent

    #159511

    wank
    Member

    This should get all links to appear the way you specified in your example code:


    a:link, h2 a, h3 a {color: #FFFF00; text-decoration: none}
    a:visited, .entry p a:visited, h2 a:visited, h3 a:visited {color: #FFBF00; text-decoration: none}
    a:active {color: #C0FFC0; text-decoration: none}
    a:hover, h2 a:hover, h3 a:hover {color: #C0FFC0; background-color: lightslategray; text-decoration: none}

    (crosshairs on links aren’t a great idea from an accessibility point of view, but then neither is aqua on a light grey background, so feel free to put it back in if you really want it)

    I don’t know whether you also wanted to change the widget titles in the sidebar, but to make them yellow too you’d use h3 {color: #ffff00;}

    #159514

    sketchygirl
    Member

    Thanks that worked…I didn’t want all the junky colors on it – the particular tutorial I copy-pasted from used loud colors so you could see what was going on.

    Thanks a million!

The topic ‘Help with Black Letterhead’ is closed to new replies.