Why are Glyphicons showing as numerical codes in Firefox with Bootstrap 3?

Glyphicons Not Displaying Properly in Firefox with Bootstrap 3

Upon migrating to Bootstrap 3 from version 2.3, users may encounter issues displaying glyphicon icons correctly. In particular, Firefox users have reported that icons are displaying as numerical codes (e.g., 'E001') instead of their intended visual representations.

Solution:

The issue stems from corrupted font files included in the customized version of Bootstrap. To resolve it:

1. Download the following font files manually:

   • https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.svg
   • https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.woff
   • https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.ttf
   • https://netdna.bootstrapcdn.com/bootstrap/3.0.0/fonts/glyphicons-halflings-regular.eot
2. Replace the existing font files in your Bootstrap directory with the downloaded ones.
3. Perform a strong reload in your browser (CTRL F5).

After these steps, glyphicon icons should display correctly in Firefox and all other browsers. Note that you may need to clear your browser cache for the changes to take effect fully.

The above is the detailed content of Why are Glyphicons showing as numerical codes in Firefox with Bootstrap 3?. For more information, please follow other related articles on the PHP Chinese website!