Fala galera, tudo bem?
Meu código do exercício ta funcionando perfeitamente, mas por curiosidade eu resolvi restar no safari e acabei tendo um problema...
Chrome: http://imgur.com/haFf1Po
Safari: http://imgur.com/FNISUWV
Onde no safari, os ícones inseridos pela biblioteca, através da tag <i>
, não funcionam.
Alguém sabe me dizer o motivo?
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Alura Typer</title>
<link rel="stylesheet" href="css/libs/materialize.min.css">
<link rel="stylesheet" href="css/libs/google-fonts.css">
<link rel="stylesheet" href="css/estilos.css">
</head>
<body>
<div class="container">
<h1 class="center">Alura Typer</h1>
<p class="frase">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sed quam tempus, malesuada ligula et, sollicitudin enim. Integer iaculis tempor nisi, sed laoreet tellus pharetra sed. Integer dapibus sagittis mauris, vel imperdiet est facilisis non. Praesent rhoncus suscipit nunc eu volutpat. Morbi nibh odio, varius vitae quam lobortis, hendrerit facilisis lectus.</p>
<ul class="informacoes center">
<li>
<i class="material-icons icones">description</i>
<span id="tamanho_palavras">30</span> Palavras
</li>
<li>
<i class="material-icons icones">query_builder</i>
<span id="timer">3</span> Segundos
</li>
</ul>
<textarea class="text-area" cols="30" rows="10"></textarea>
<div class="botoes">
<a class="btn-floating btn-large waves-effect waves-light red" id="botao-reset"><i class="material-icons">restore</i></a>
</div>
<ul class="center">
<li><span id="contador-caracteres">0</span> Caracteres</li>
<li>
<span id="contador-palavras">0</span> Palavras
</li>
</ul>
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>