arrows in dropdown menu are gone and have strange graphic instead

  • Author
    Posts
  • #27444
    Carrie

    I updated the theme of our website and for the most part the transition seems to be going well. A few things here and there to fix, but I am stuck on this one. My nav menu has dropdowns. There should be little arrows to the right of the menu items that drop down, but they aren’t there. Instead there is a small box in chrome and a box with letters in it with firefox. How do I get the arrrows back?

    #27888
    KJ

    Hi Carrie. I have the same menu problem with my Tempera theme. Little boxes instead of arrows for dropdown. Did you manage to fix the issue?

    #27947
    Zed
    Cryout Creations mastermind

    You are both using caching plugins. CSS minification currently breaks font support in Tempera.
    Disable CSS minification in the caching plugin and the menus glyphs (and fonts for that matter) will return to normal.
    We’ll correct this in a future update.


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #28333
    Kelley

    Hi, I have the same problem but don’t seem to have a plugin for caching as you suggest. Can you be more specific or offer another solution?

    #28520
    Zed
    Cryout Creations mastermind

    Kelley, you are encountering a different… behaviour.
    If you access your site via http://www.dumcpreschool.org, the icons will appear correctly, but if you access it via dumcpreschool.org (no www.) the icons will be invalid.

    See http://stackoverflow.com/questions/11616306/css-font-face-absolute-url-from-external-domain-fonts-not-loading-in-firefox for more info.


    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    #28678
    Bara

    Hello,
    I have the same issue and cannot find root cause.
    I have two environments – production and dev/test. They are more or less same, always before I do any major change I test it in test first.
    In dev env the icons work as expected but from some reason I’m not able to find why they don’t work in production. There shall not be any major differences between the two sites but still it doesn’t work in prod.
    http://buric-hair.com/ – doesn’t work in Chrome or Firefox
    http://dev.buric-hair.com/ – is OK.

    I used the hint in previous posts – to remove the arrows from menu completely – but it is not exactly what I wanted. I would prefer to have them as they should be.

    Thanks a lot for help or any hint.
    Bara

    #28742
    akis_man

    I solve the problem by changing in style.css this:

    #access > .menu > ul > li > a:not(:only-child) span:after {
    	font-family:"Open Sans";
        content: '\25be'; /*this one was the old one --> \e80a';*/
        position: absolute; 
        right: 5px;
        top: 10px;

    After that my site looks like that:
    after changes in style.css

    The arrows is a bit different, but they work.
    The arrows can be found in:

    #28743
    akis_man

    The arrows can be found in: http://www.utf8icons.com/

    #28768
    Bara

    Hello,

    thank you very much. Works for the main menu which is great. Helped a lot!
    Only it doesn’t help for the other icons. The back to top icon or the icons in the website path (which I’m anyway figuring out how to get rid of). So the main issue resolved by nice workaround. Still I cannot see why on one site the Elusive icons work fine and on the other which is same the don’t.

    Thanks a lot for useful hint!

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘arrows in dropdown menu are gone and have strange graphic instead’ is closed to new replies.