Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Alinhando os elementos

Referente ao curso HTML e CSS: Classes, posicionamento e Flexbox, no capítulo Posicionando mais elementos e atividade Faça como eu fiz: alinhe os elementos

por Fernanda De Oliveira Ferreira
| 57.2k xp | 17 posts
<!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" />
    <title>Portifolio</title>
    <link rel="stylesheet" href="style.css" />
  </head>
  <body>
    <header></header>
    <main class="apresentacao">
      <h1>
        Eleve seu negócio digital a outro nível
        <strong class="titulo-destaque">
          com um Front-end de qualidade!
        </strong>
      </h1>
      <p cla>
        Olá! Sou Joana Santos, desenvolvedora Front-end com especialidade em
        React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem em
        prática boas ideias. Vamos conversar?
      </p>
      <a href="https://instagram.com/rafaballerini">Instagram</a>
      <a href="https://github.com/guilhermeonrails">GitHub</a>
      <img src="imagem.png" alt="Foto da Joana Santos programando" />
    </main>
    <footer></footer>
  </body>
</html>

* {
  margin: 0;
  padding: 0;
}
body {
  background-color: #000000;
  color: #f6f6f6;
  height: 100vh;
  box-sizing: border-box;
}

.titulo-destaque {
  color: #4be555;
}

.apresentacao {
  display: flex;
  align-items: center;
}

a {
  color: #4be555;
}
2 respostas
solução!
por Lorena Garcia
| 8949.5k xp | 13352 posts
Alura Scuba Team Suporte Educacional

Oi Fernanda, tudo bem?

Gostaria de parabenizá-la pelo desenvolvimento do seu projeto de portfólio. A utilização de display: flex e align-items: center na classe .apresentacao é uma escolha eficaz para alinhar verticalmente os elementos.

A adição do espaçamento entre os elementos e a estilização global com reset de estilos são práticas recomendadas. No entanto, sugiro considerar a adição de algum espaçamento inferior ao texto do corpo para melhorar a legibilidade.

Continue o bom trabalho!

Um abraço e bons estudos.

por Wglaer Dos Santos Gomes
| 25k xp | 1 posts

Boa noite,

Você não concluiu o elemento 

index.html

Você não concluiu o elemento <p cla> 
    
<p class="apresentacao__conteudo__texto">
    Olá! Sou Joana Santos, desenvolvedora Front-end com especialidade em
    React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem em
    prática boas ideias. Vamos conversar?
 </p>
  
  styles.css
.apresentacao__conteudo__texto{
    font-size: 24px;

}