Twitter Bootstrap Question posted in

why is one glyphicon displayed but not the other? – Twitter bootstrap

I’m using Twitter Bootstrap v.3 on this page and I have the following markup in the page footer:

<footer class="footer text-center">
    <span class="contact-point">
        <span class="glyphicon glyphicon-earphone"></span>
        087-2562153 / 01-2876730
    </span>
    <span class="contact-point">
        <a href="mailto:[email protected]">
            <span class="glyphicon glyphicon-envelope"></span>
            [email protected]
        </a>
    </span>
</footer>

This should show a phone number and an email address with a glyphicon for each. However, for some reason, the icon for the phone is not rendered correctly (a square is shown instead), but the email icon is fine.

What does one glyphicon shown correctly, but the other doesn’t?

Tags:

2

Answers


  1. 0

    I guess the glyphicon font file is corrupted. Try a new copy of bootstrap or manually include all the glyphicon fonts into your css.

    Login or Signup to reply.
  2. 0

    The glyphicon font files cannot be found:

    enter image description here

    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<footer class="footer text-center">
    <span class="contact-point">
        <span class="glyphicon glyphicon-earphone"></span>
        087-2562153 / 01-2876730
    </span>
    <span class="contact-point">
        <a href="mailto:[email protected]">
            <span class="glyphicon glyphicon-envelope"></span>
            [email protected]
        </a>
    </span>
</footer>

    I tested it using a Bootstrap CDN, works ok.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search