4

I have this code 

.progress-button .content::before {
    content: "\e601";
}

.progress-button .content::after {
   content: "\e601";
}

It basically returns the value of "\e601" into a check mark and "\e600" into a X sign, the code works well in normal HTML/CSS but when I implemented it into Bootstrap 3, it shows a square sign instead. Can someone please shed me some lights? Thanks in advance! :)

smalinux
  • 1,132
  • 2
  • 13
  • 28
Christopher Bobby
  • 57
  • 1
  • 8
  • 1
    You have to include font-awesome related font files – San Sep 22 '16 at 10:33
  • Include `font-family` and then `content` – L J Sep 22 '16 at 10:36
  • I tried using glyphicon by putting it exactly after content: but also it didn't work – Christopher Bobby Sep 22 '16 at 10:36
  • I have linked it to font-awesome in header, and also the respective font-family , still no result friends :( – Christopher Bobby Sep 22 '16 at 10:40
  • Could you please share the code? – L J Sep 22 '16 at 10:44
  • Questions seeking code help must include the shortest code necessary to reproduce it **in the question itself** preferably in a [**Stack Snippet**](https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets/). See [**How to create a Minimal, Complete, and Verifiable example**](http://stackoverflow.com/help/mcve) – Paulie_D Sep 22 '16 at 10:46
  • hey guys, it worked, yeah the advised solutions worked. I mistakenly put the font into wrong folder – Christopher Bobby Sep 22 '16 at 10:57

1 Answers1

1

You'll have to add the below line in your head tag and define the font-family wherever you use these unicode characters in your custom css file. Then only will you be able to see the desired icon.

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

Refer this for more details.

Community
  • 1
  • 1
Safal Pillai
  • 1,567
  • 1
  • 16
  • 31