• Resolved blackss32

    (@blackss32)


    hi, i have been looking through templates for the last hour looking for the font color and hover color on the main index page. rg: screen shoot.

    screen shot

    that font is not in the style css, the only place i thought it could be is the main index template.

    im totally at a hold here.

    some support would be amazing please.
    just need to change that font color.

    the before you click the link and after you click the link color font.
    thanks.

Viewing 11 replies - 1 through 11 (of 11 total)
  • That would be the anchor styling; in your css do a search for a. You will be changing the a:hover styles.

    Thread Starter blackss32

    (@blackss32)

    hi, thanks but still cant find it in style css

    */
    
    /* global resets */
    html, body, h1, h2, h3, h4, ul, ol, code, blockquote, p, img, table, th, td, hr, br {border: none; margin: 0; padding: 0;}
    
    /* general styles */
    body {background: #000000 url(images/gradient.jpg) repeat-x; font: 75%/160% Verdana, Arial, Geneva, sans-serif; text-align: center;}
    h1, h2, h3, h4 {font-family: Georgia, "Times New Roman", Times, serif; margin-bottom: 10px;}
    p {margin-bottom: 25px;}
    ul, ol {margin-bottom: 10px;}
    table {border-collapse: collapse; margin: 0 auto 25px;}
    th, td {padding: 3px;}
    
    /* layout */
    #wrap {background-color: #ffffff; color: #000000; width: 980px; margin: 10px auto; text-align: left;}
    #content {float: left; width: 650px; margin: 25px 0 25px 20px;}
    #sidebar {float: right; width: 250px; margin: 25px 20px 25px 0; padding: 0 10px}
    #footer {clear: both; text-align: center;}
    
    /* header */
    #header h1, #header h2, #header h3 {font-size: 1.4em;}
    #header {background-color: #000000; border-bottom: 15px solid #000; margin: 0; padding: 0;}
    #header hr.clear {border: none; color: #; clear: both; line-height: 0;}
    #topnav {background-color: #000; padding: 5px; color: #33CC33; text-align: right;}
    #topnav a {color: #33CC33;}
    #header .benefits-banner {width: 450px; float: left; margin-left: 20px;}
    #header .ratings-banner {width: 450px; float: right; margin-right: 20px;}
    #header .ratings-banner ul {list-style: none;}
    
    /* content */
    #content h1, #content h2, #content h3 {font-size: 2em;}
    #content ul, #content ol {margin: 0 0 25px 35px;}
    #content blockquote {margin: 10px 25px; padding: 10px; border: 1px solid #000000; background-color: #0D0D0D;}
    
    /* sidebar */
    #sidebar {background-color: #0D0D0D; border: 1px solid #33CC33; text-align: right;}
    #sidebar h4 {border-bottom: 1px solid #ffffff; margin-top: 5px; font-weight: normal; font-size: 1.3em; text-align: right;}
    #sidebar ul {list-style: none; margin: 0 0 15px;}
    #sidebar ul li {margin-bottom: 5px;}
    #sidebar ul ul {margin: 0;}
    
    /* footer */
    #bottomnav {background-color: #000; color: #33CC33; padding: 5px;}
    #bottomnav a {color: #33CC33;}
    .designer-credit {font-size: 0.8em; color: #CC0033; padding-bottom: 10px;}
    .designer-credit a {color: #BCBCBC;}
    
    /* img styling */
    img.floatleft {float: left; margin-right: 8px;}
    img.floatright {float: right; margin-left: 8px;}
    img.centered {display: block; margin: 0 auto; text-align: center;}
    
    /* misc */
    
    #wrap, #header, #content, #sidebar, #footer {overflow: hidden;} /* avoid theme breakage by large images or elements */
    a.hilight {color: #CC0033 !important;}
    .center {text-align: center;}
    .justify {text-align: justify;}
    .right {text-align: right;}
    .left {text-align: left;}

    Then add a a:hover element to your stylesheet with the font and color properties you want. For the sake of organization, I would add it to your Misc section.

    Thread Starter blackss32

    (@blackss32)

    thanks, but im not the best with codes.
    would it be pushing it to ask you for an example please?
    of where and what to put.
    thanks dude.

    Thread Starter blackss32

    (@blackss32)

    ah got the hover working:

    a:hover {
    color: #147;
    text-decoration: underline;
    }

    but just need the font change

    Use font-family: Arial for example.

    Thread Starter blackss32

    (@blackss32)

    im not sure what you mean without a code sorry m8.

    i have used this code:
    a:visited {
    color: #ffffff;
    }

    a:hover {
    color: #000000;
    }

    works ok apart from edit and contact are still blue.

    Thread Starter blackss32

    (@blackss32)

    ah this works:
    a {
    color: #CC0033;
    }

    a img {
    border: none;
    }

    a:visited {
    color: ##BCBCBC;
    }

    a:hover {
    color: #ffffff;
    }

    thanks heaps m8, cheers.

    a {
       color: #ff0000;
       font-family: Times New Roman;
    }
    
    a:visited {
       color: #ffffff;
       font-family: Arial;
    }
    
    a:hover {
       color: #000000;
       font-family: Verdana;
    }

    Obviously you wouln’t use this combination, but I am giving you an example. You can also do it like so:

    a, a:visited, a:hover, a:active {
       color: #0000ff;
       font-family: Arial;
       text-decoration: underline;
    }

    but again, you wouldn’t want these exact styles, as chances are they would not work well together, but it is given as an example.

    Thread Starter blackss32

    (@blackss32)

    thanks jeromyboyd, i have one more font to change, the writing in the posts, sorry.

    Thread Starter blackss32

    (@blackss32)

    ahhh found it, thx.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘cant find this font anywhere, need to change the color’ is closed to new replies.