Why Google Material Icons Can't be Shown on Mobile

问题

I am using Materializecss and it uses Google design icons. On some mobiles, Google Material-Icons can'be shown. What is caused it?

回答1:

The problems is occurred because of text-rendering property. Text-rendering is not a CSS standart but it allows use to choose text quality.

In google material css this property comes with it's default value . If you add this style you will solve the problem :

.material-icons {
    text-rendering: optimizeLegibility;
}

By this definition, we say to the browser that, "emphasize legibility over rendering speed and geometric precision."

https://css-tricks.com/almanac/properties/t/text-rendering/

来源：https://stackoverflow.com/questions/31933785/why-google-material-icons-cant-be-shown-on-mobile