I hosted a site on Github pages, and the material icons are not showing. The issue is that they are showing when I launch the index.html page from my browser (instead of going to the hosted page).
Here's the html for this part:
<link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection"/>
<link rel="stylesheet" type="text/css" href="style.css"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<div class="col s12 m6">
<div class="card-content blue-text text-darken-2">
<span class="card-title">Olivier Grech</span>
<div><a href="mailto:mail"><i class="material-icons">email</i></a><em>mail</em></div>
<!--Rest of the page-->
https and it will work:
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
If you open your developer tools(right click anywhere and click
inspect, then go to the console), it would tell you whats wrong. In this case you were accessing the github page over https but were trying to load the font using http which is not considered safe and was blocked by the browser.