glyphicon not showing inside a button

Question

I have the following button:

<button class="glyphicon glyphicon-option-horizontal" (click)="myFuncion()"></button>

After upgrade my bootstrap library from 3 to 4.2.1 the icon stop showing.

I was tried to insert the glyphicon glyphicon-option-horizontal classes into span or i but it's not looks like before

score 2 · Answer 1 · answered Apr 18 '19 at 14:16

as Bootstrap 4+ have to use the fontawesome icons instead of glyphicons please check the below stackblitz https://stackblitz.com/edit/angular-gfjyrc

<P>Boot strap 4+ using font awesome</P>
<button type="button" class="btn btn-primary"><i class="fa fa-search"></i>Primary</button>

<p>Bootstrap 4+ using glyphicon</p>

<button type="button" class="btn btn-primary">
    <span class="glyphicon glyphicon-search"></span> Search
  </button>

Please check this url for more details https://getbootstrap.com/docs/4.0/migration/

rcanpahali · Answer 2 · 2019-04-18T13:58:31.403

0

Could you try this please,

<button type="button" class="btn btn-default" (click)="myFuncion()">
  <span class="glyphicon glyphicon-search"></span> Search
</button>

Update: I've just found that glyphicon were removed from BT4, so you should add it manually. Check this out.

edited Apr 18 '19 at 13:58

answered Apr 18 '19 at 13:45

rcanpahali

2,565
2
21
37

Thanks for your answer, I'm trying what you suggest but it's not showing as expected, It's show like empty button without the glyphicon – ArmoArmo Apr 18 '19 at 13:51
Please add screenshot, or create stackblitz repo. – rcanpahali Apr 18 '19 at 13:52

glyphicon not showing inside a button

2 Answers2