Gostaria de saber o que estou fazendo de errado, quero que quando o usuário entre no meu site pelo celular, mude algumas dimensões da minha página, background e outras coisas que vou alterar..
@media screen and (max-width: 480px){
div#container {
background-color: red;
margin: 2% 0 2% 0;
}
}
#container {
background-color: silver;
margin: 2% 12% 2% 12%;
padding: 2% 5% 2% 5%;
color: #252525;
}
<!DOCTYPE html>
<html lang="PT-BR">
<head>
<title></title>
<link rel="stylesheet" href="_css/estilo.css"/>
<meta charset="UTF-8"/>
</head>
<body>
<div id="container">
<p> aqui eu tenho alguns parágrafos no meu site..</p>
<p>porém visto pelo celular fica muito pequeno ou as margens ficam muito grande, queria que se tornasse responsivo</p>
</div>
</body>
</html>
Obs: Já olhei outros tópicos relacionados aqui no site porém na prática eu não consegui, então resolvi postar. Agradeço desde já!