.icone-redes-sociais li {
display: inline-block;
text-transform: lowercase;
height: 40px;
width: 40px;
}
.github {
background: url("images/github.png");
}
.twitter {
background: url("images/twitter.png");
}
.linkedin {
background: url("images/linkedin.png");
}
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas
respostas
Se a tag <a> está inserida dentro da tag <li>, por que essa minha linha de código não permite que eu altere o height e width da minha imagem uma vez que defini o display como inline-block?
solução!
.icone-redes-sociais li {
display: inline-block;
text-transform: lowercase;
height: 40px;
width: 40px;Não sei como está seu HTML, eu precisaria ver pra te dar uma resposta mais clara, mas ao que tudo indica, você está selecionando a li, inteira e não só a imagem, meio que está selecionando o container ( uma caixa invisível ) e não a imagem em si.
A forma mais simples de resolver isso seria adicionando uma classe para a tag <a> ou adicionar a tag <a> no seu seletor exemplo:
.icone-redes-sociais li a {
display: inline-block;
text-transform: lowercase;
height: 40px;
width: 40px;Imagino que isso ja resolva o problema mas, se não resolver posta o código html, pra resolvermos. Espero ter ajudado, um abraço
Por que a tag por default é inline e tags inline não é possível adicionar tamanho. Para que sua imagens pegue tamanho é preciso adicionar o seguinte código: .icone-redes-sociais a { display: inline-block; } ou até mesmo: .icone-redes-sociais a { display: block; }
obrigado, galera!