Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Google font Nixie One not displaying on Chrome & Safari

  • This topic is empty.
Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #152385
    carrieloves
    Participant

    Hello,

    I’m using a PC and designing for a Blogger Blogspot blog Verily Us

    I am trying to use Nixie One font on my post titles. It’s showing perfectly with Firefox and IE, but on Chrome I get a bold Comic Sans and on Safari my post titles are totally missing.

    Thanks in advance!
    Carrie

    #152388
    TheDoc
    Moderator

    It appears to be working fine for me, but the CSS isn’t the best. You have this:

    h3.post-title {
    font: normal normal 30px Century Gothic, Tahoma, Helvetica, FreeSans, sans-serif;
    margin: 0;
    font-family: 'Nixie One', cursive;
    }
    h3.post-title {
    font: #6ac8cb;
    }
    h3.post-title a {
    font: #6ac8cb;
    }
    h3.post-title a:hover {
    font: #d6148c;
    }
    

    It should look like this:

    h3.post-title {
        font-size: 30px;
        margin: 0;
        font-family: 'Nixie One', cursive;
        color: #6ac8cb;
    }
    
    h3.post-title a {
        color: #6ac8cb;
    }
    
    h3.post-title a:hover {
        color: #d6148c;
    }
    

    Notice I’ve switched font to the appropriate color and cleaned up some of the font settings. This error is happening in all sorts of places throughout the CSS, possibly leading to some browser inconsistencies.

    #152390
    carrieloves
    Participant

    Thank you, I replaced the CSS with what you sent and it’s still producing the same thing. Comic Sans in Chrome and no post title at all in Safari.

    I can’t attach an image here, but here’s a link to to a .jpg of what I am seeing.

    #152395
    Paulie_D
    Moderator

    Working for me too in Chrome 30.

    Perhaps it’s a caching issue?

    #152396
    carrieloves
    Participant

    That was one of the first things I tried, I cleared my cache/cookies for Chrome & Safari and nothing changed. I’ve even tried using other fonts and those will work fine in all browsers, it’s just this font Nixie One that is giving me problems.

    #152397
    TheDoc
    Moderator

    I’d love to see if there are any console errors in Chrome. Simply right click, Inspect Element (any element, doesn’t matter) and then navigate to the ‘Console’ tab. Screenshot any errors that are in there.

    #152398
    carrieloves
    Participant

    There was only one:

    Uncaught TypeError: Cannot read property ‘msie’ of undefined

    #152399
    carrieloves
    Participant

    and this is the console error for Safari:

    TypeError: ‘undefined’ is not an object (evaluating ‘$.browser.msie’)

    #152401
    Alen
    Participant
    #152402
    carrieloves
    Participant

    Hi Alen, I’m not exactly sure what I am supposed to do? How do I fix it in Blogger?

    #152403
    carrieloves
    Participant

    So I went back to jquery 1.8.3 instead of 1.10.2 and that removed both of those console errors in Safari & Chrome. But, the font and post titles are still not displaying correctly.

    #152405
    carrieloves
    Participant

    Some more testing and I found the conflict is with Font Awesome Icons. I removed the code for Font Awesome and the Nixie One shows perfectly in all 4 browsers.

    Funny how it was just this font that conflicted with the Font Awesome code.

    Anyways,
    Thanks everyone!

    #152407
    Alen
    Participant

    :)

Viewing 13 posts - 1 through 13 (of 13 total)
  • The forum ‘CSS’ is closed to new topics and replies.