0

My Bootstrap Glyphicons are not showing up for some reason.

I have tried the answer found here, here, here, and here

Here is my HTML:

<div class="service-wrapper">
     <h2 class="pricing-plan-title">Plan</h2>
     <span class="glyphicon glyhpicon-pencil" aria-hidden="true"></span>
    <p>Praesent rhoncus mauris ac sollicitudin vehicula. Nam fringilla turpis turpis</p>
</div>

Can anybody see what I am missing?

Community
  • 1
  • 1
Allen Levings
  • 142
  • 11
  • As you can see, it's not showing up in this fiddle, but the cloud is. Maybe the pencil is not a valid icon. http://jsfiddle.net/Godisgood/8175t4uc/ – Ian Hazzard Nov 18 '14 at 00:42
  • Downvote for a typo? Harsh... – Allen Levings Nov 18 '14 at 01:23
  • Thanks for evening out that downvote kind stranger! LoL – Allen Levings Nov 18 '14 at 01:35
  • Love your user name BTW. God IS good. All the time! – Allen Levings Nov 18 '14 at 01:43
  • And all the time . . . – Ian Hazzard Nov 18 '14 at 01:43
  • @AllenLevings, the downvote was neither "for a typo" nor "harsh". It *was* because `This question does not show any research effort`. There was no good faith attempt to format your question to make readable for anybody else. There was little attempt to take the effort of removing code one by one to see what was breaking your code. There was no attempt to look up the documentation and see what the official usage of of the symbol was. I'm not saying this to be a jerk, but so you truly understand the way members of this community often vote so you can compose better questions in the future. – KyleMit Nov 18 '14 at 14:27
  • I understand the typo was a dummy mistake, but to say no research? Did I not provide 4 links as to things I tried? I am not buying it. Sorry man. I will keep your advice for future reference however. – Allen Levings Nov 18 '14 at 14:33
  • @AllenLevings, linking to other questions is a good start, but that was researching *other people's* problems, not your own. If something was wrong with the glyphicon, why not test a page that only had the code ``. Then if it wasn't working, just include that in your question. Then prove to everyone else why it should be working by linking to the docs (http://getbootstrap.com/components/#glyphicons-glyphs) to show you're using the right thing. By this point in the investigation, 90% people have solved the problem on their own. Plus Formatting! – KyleMit Nov 18 '14 at 15:24
  • Downvote for formatting? C'mon Kyle! It is obvious I am still new here so some advice would have gone farther than a downvote. And I am still not buying your research excuse. Not useful to other members of the community I can accept, but research? Either way, it is what it is. – Allen Levings Nov 18 '14 at 15:27

2 Answers2

4

You need to correct your spelling from glyhpicon to glyphicon:

<!-- From: --> <span class="glyphicon glyhpicon-pencil" aria-hidden="true"></span>
<!-- To:   --> <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
KyleMit
  • 30,350
  • 66
  • 462
  • 664
Macsupport
  • 5,406
  • 4
  • 29
  • 45
  • Man! Even after you told me the problem it took me 5 minutes to find the typo! 10 straight hours I suppose is enough. It is clearly time to take a break... Thanks for the help! – Allen Levings Nov 18 '14 at 01:34
3

There is a typo in your code.

In the glyphicon-pencil, the word glyphicon is wrongly typed.

Try this

<span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
VSri58
  • 3,691
  • 2
  • 14
  • 16