Grow your CSS skills. Land your dream job.

Icon font :before standard width

  • # February 8, 2013 at 2:20 pm

    http://codepen.io/anon/pen/mlHoi

    for some reason the E and F icon are different widths

    how should i set it so that all the text starts at the same indent

    Thanks

    # February 8, 2013 at 2:38 pm

    Your icon font wont show up in Codepen unless you web link in the actual font. Just calling it won’t work.

    # February 11, 2013 at 10:58 am

    thats unfortunate… seems to work in firefox. Chrome and Safari dont put a referer in the request header from codepen requests

    screenshot
    http://i.imgur.com/0kuyqNG.png
    and up to date codepen

    http://codepen.io/mark/pen/mlHoi

    # February 11, 2013 at 11:09 am

    inline elements won’t take a width. A simple fix is to declare the :before element display: inline-block; (and perhaps text-align: center;)

    # February 11, 2013 at 11:19 am

    Interesting, I get the icons in FF but not in Chrome.

    Try adding

    display:inline-block;
    text-align:center;

    to the pseudo-element

    # February 11, 2013 at 11:19 am

    @wolfcry911 Oh SNAP!

    # February 11, 2013 at 12:12 pm

    you both rock! That was driving me crazy

    Thanks so much!

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

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".