Some of Bootstrap3 glyphicons are not displayed co

Question

Please have a look at this attached screenshot. It is my PhoneGap testing app - taken on a Galaxy S4.

You should see that the bell, bookmark, briefcase, and camera icons (and more) are not displayed as expected.

Here are my observations:

1. All icons can be displayed correctly in browsers (chrome, safari), on both PC and mobile devices
2. All icons can be displayed correctly in the same app for ios (checked in iphone/ipad, ios7)

The "question mark" can only be seen in an Android app.

Does anyone know the reason why?

Answer 1

It's a problem with the escape sequences. If you can reliably maintain a UTF-8 encoded CSS file, you could override the Bootstrap defaults to use the actual, non-escaped glyphs.

(Depending on your browser, the following code will appear to contain a bunch of boxes. Copying the code and pasting it into a UTF-8 document should preserve the values, though.)

@charset "UTF-8";

.glyphicon-bell:before {
  content: "                                                                    

                                                        
            

查看更多

0人赞 添加讨论(0) 举报

Answer 2

It could be because of mismatch between version of bootstrap min .css file and glyph files.