Oi bom eu queria diminuir meus icones mqis com a propriedade width não da!
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Oi bom eu queria diminuir meus icones mqis com a propriedade width não da!
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="normalize.css">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<header>
<h1>Geovane <br>
<div class="espaço-titulo">desenvolvedor front-end</div>
</h1>
<nav class="menu-navegação">
<a class="menu-link" href="#">About</a>
<a class="menu-link" href="#">Projetos</a>
<a class="menu-link" href="#">Skills</a>
<a class="menu-link" href="#">Contatos</a>
</nav>
</header>
<hr>
<main>
<h2>
About
</h2>
<div class="sobre">
<p class="descrição">Meu nome é Geovane tenho 25 anos, estudo linguagem de programação <br> na escola online alura e gosto de tecnologia em geral. <br> Tenho conhecimento em html e css e estou estudando java script e web responsivo. <br> Procuro estágio na área
e será muito bom fazer parte da sua equipe. <br> Se quizer saber um pouco mais sobre meu <br> trabalho ou bater um bom papo entre em contato logo abaixo!
</p>
<img src="escritório.png" alt="escritório">
</div>
<h3 class="Projetos">
Projetos
</h3>
<p class="informações-de-projetos">
Ops! Por enquanto não tenho nenhum projeto, mais está em construção!
</p>
<h4>
Skills
</h4>
<div class="Skills">
<img class="fotos" src="html.png" alt="">
<img id="css" class="fotos" src="css.png" alt="">
<img id="git" class="fotos" src="git.png" alt="">
<img class="fotos" src="figma.png" alt="">
</div>
<h5 class="Contatos">
Contatos
</h5>
<form action="">
<div class="box-form">
<div class="form">
<div class="nome-sobrenome">
<label class="formulário" for="nome">Nome e Sobrenome</label>
<div class="nome-sobrenome-input">
<input class="formulário" type="text" placeholder="Nome e sobrenome">
</div>
</div>
<div class="e-mail">
<label class="formulário" for="e-mail">E-mail</label>
<div class="e-mail-input">
<input class="formulário" type="email" id="e-mail" placeholder="Exem:email@gmail.com">
</div>
</div>
<div class="numero">
<label class="formulário" for="numero">Numero</label>
<div class="numero-input">
<input class="formulário" type="tel" placeholder="Telefone">
</div>
</div>
<div class="assunto">
<label class="formulário" for="text">Assunto</label>
<div class="assunto-input">
<textarea class="formulário" name="" id="" cols="30" rows="10"></textarea>
</div>
</div>
<div class="enviar-button">
<button class="formulário">enviar</button>
</div>
</div>
<div class="img-form">
<img class="foto" src="formulário.jpg" alt="">
</div>
</div>
</form>
</main>
<footer>
<hr>
<div class="social-midia">
<a class="linkedin" href="https://www.linkedin.com/in/geovaneferreira10/"><img src="linkedin.png" alt=""></a>
<a class="instagram" href="https://www.instagram.com/geovane8724/"><img src="instagram (2).png" alt=""></a>
<a class="facebook" href="https://m.facebook.com/geovane.santana.925059"><img src="facebook.png" alt=""></a>
</div>
</footer>
</body>
</html>header {
display: flex;
vertical-align: middle;
justify-content: space-between;
align-items: center;
margin-right: 4%;
}
hr {
width: 98%;
}
h1 {
font-size: 40px;
margin-left: 3%;
}
.sobre {
display: flex;
align-items: center;
}
h2 {
color: #7d7dde;
font-size: 57px;
margin-left: 6%;
}
.Projetos {
text-align: center;
color: #7d7dde;
font-size: 57px;
}
h4 {
text-align: center;
color: #7d7dde;
font-size: 57px;
}
.Skills {
text-align: center;
}
.Contatos {
text-align: center;
color: #7d7dde;
font-size: 57px;
}
.fotos {
margin-left: 110px;
}
#git {
width: 180px;
}
p {
text-align: center;
font-size: 27px;
margin-left: 50px;
}
.formulário {
display: flex;
margin-left: 230px;
margin-top: 10px;
}
input {
border-radius: 50px;
border-color: #7d7dde;
}
textarea {
border-radius: 10px;
border-color: #7d7dde;
}
.box-form {
display: flex;
}
.formulário button {
margin-right: 50px;
}
.enviar-button {
display: flex;
justify-content: center;
margin-bottom: 5px;
}
.foto {
width: 420px;
margin-top: 10px;
margin-left: 200px;
}
.espaço-titulo {
margin-left: 40px;
}
.menu-link {
margin-right: 20px;
color: #BBBBBB;
text-decoration: none;
font-size: 210%;
}
.menu-link:hover {
color: black;
}
.social-midia {
display: flex;
}
@media screen and (max-width:480px) {
h1 {
margin-left: 50px;
font-size: 100px;
}
.espaço-titulo {
margin-left: 0px;
}
.menu-link {
background-image: url(menu-amburguer.png);
background-repeat: no-repeat;
background-size: cover;
}
}
Fala Geovane, tudo bem?
Pode ser que você não esteja selecionando os elementos corretamente, tente assim:
.social-midia img {
width: 40px; //Width desejado
}Testa ai e conta pra gente se deu certo :D