Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

12 Desafios finais - Desenvolvendo a página de Portifolio

Boa tarde,estou com problemas na conclusão da página,as fotos BMW,UOL,IBM e G1 assim como a foto Eu.jpg (Jão da Silva) não carregam e também sumiram os ícones de rede sociais (github,twitter e linkedin). POstarei o código CSS e o html por favor se alguém puder me ajudar eu agradeço.

Código html

<!DOCTYPE html>

Portifolio

Veja abaixo a lista dos meus projetos mais relevantes

Minha foto

João da Silva

© João da Silva 2014

código CSS

body { font-family: "Crimson Text", "Times New Roman", serif; background-color: #F2FFFC; font-size: 120%; line-height: 1.5; } h1{ font-family: "Open Sans Condensed", "Arial", sans-serif; text-transform: uppercase; }

.titulo-principal { font-size: 60px; text-align: center; background-color: #851944; color: #FFF; padding: 25px; border-bottom: 10px solid #000; } main a { color: #851944; } p { text-align:center; margin: 10px 0;

} aside { text-align:center; background-color: #3C1D3D; color: #F2FFFC; padding:20px;} .navegacao-site a { color: inherit; font-family: "Open Sans Condensed", "Arial", sans-serif; text-transform: lowercase;} .navegacao-site h1 { font-size: 30px; margin-bottom: 25px;}

.rodape-pagina { background-color: #000; color: #F2FFFC; padding: 20px; clear:both; position: fixed; bottom: 0; width: 100%; } .container { width: 720x; margin-left: 0 margin-right: auto; padding: 30px 0; padding-bottom: 80px; } .icones-redes-sociais li { display: inline-block; }

.icones-redes-sociais a { width: 40px; height: 40px; display: block; text-indent: -99999px; }

.github { background-image: url(github.png); } .twitter { background-image: url(twitter.png); } .linkedin { background-image: url(linkedin.png); } main { padding-bottom:80px; width: 80%; float: left; } aside,.minha-foto { float: right; border-left: 10px solid black; border-bottom: 10px solid black; box-sizing: border-box; } aside { clear: right; width: 20%; position: relative; top: 245px; } .minha-foto { position: absolute; top: 0; right: 0; width: 20%;

} .portifolio li { display: inline-block; border: .5em solid black; background-color: #FAFFFC; width: 45%; box-sizing: border-box; padding: 1em; margin-right: 1em; margin-bottom: 1em; } .portifolio img { width: 100%; }

3 respostas

Falta vc atualizar a o caminho da pasta para onde as imagens foram movidas, no caso, img correto? Vc precisa alterar isso no seu arquivo html e tbm no css.

html, ex: Minha foto

css, ex: .github { background-image: url(img/github.png); }

Atualizar também o caminho do css, veja:

desculpe, coloquei sem formatação o anterior...

novo caminho para as folhas de estilo, ex:

<link rel="stylesheet" href="css/bio.css">
<link rel="stylesheet" href="css/blog.css">

novo caminho para imagens html, ex:

<img src="img/eu.jpg" alt="Minha foto" class="minha-foto">

css, ex:

.github {
    background-image: url(img/github.png);
}
solução!

(Resolvido) - Obrigado Leandro Souza.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software