Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] justify-content: space-between não aplicando a página

Olá pessoal, estou com um problema, o justify-content: space-between parece não funcionar da forma esperada na minha página aparentemente ele não está criando o espaço entre os elementos dentro do contêiner. O Visual Code Studio não aponta nenhum tipo de erro e eu tentei inspecionar a página para ver ser eu encontro o problema, infelizmente não o encontrei, podem me ajudar?

Código html para consulta:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <link rel="stylesheet" href="style.css">
    <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>Portfolio</title>
</head>
<body>
  <header></header>
  <main class="apresentacao">
      <section class="aprestacao__conteudo">
        <h1 class="apresentacao__conteudo__titulo">Eleve seu negócio digital a outro nível <strong class="titulo-destaque">com um Front-end de qualidade!</strong></h1>
        <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>
        <a href="">LinkedIn</a>
        <a href="">Github</a>
      </section>
      <img src="Imagem.png" alt="Foto de Joana Santos programando">
  </main>
  <footer></footer>
</body>
</html>

Código CSS para consulta: 

*{
    margin: 0;
    padding: 0;

}

body{
    box-sizing: border-box;
    background-color: rgb(1, 3, 22);
    color: #F6F6F6;
    height: 100vh;

}



.titulo-destaque {
    color: #22D4FD;

}


.apresentacao {
    margin: 10%;
    display: flex;
    align-items: center;
    justify-content: space-between;

}

.apresentacao__conteudo {
    width: 615px;

}

.apresentacao__conteudo__titulo {
    font-size: 36px;

}

apresentacao__conteudo__texto {
    font-size: 24px;

}
1 resposta
solução!

Olá Higor, tudo bem?

O problema no seu código CSS é que você esqueceu de adicionar o seletor .apresentacao__conteudo__texto antes da propriedade font-size.

.apresentacao__conteudo__texto {
    font-size: 24px;
}

Além disso, verifique se a largura definida para o elemento .apresentacao__conteudo está adequada ao espaço disponível na tela para que o justify-content: space-between; possa funcionar corretamente.

Espero que isso ajude!