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

[Projeto] Faça como eu fiz: continuando o aprendizado

imagem do exercicio proposto, uma tela dividida com imagem de um notebook e o texto sobre baixar os cursos

    <section class="container secundario">
        <div class="container__descricao">
            <p class="descricao__texto">Só o Combo+ oferece Alura+ e Alura Língua juntos para você ter acesso a cursos de diversas áreas da tecnologia e aprender inglês ou espanhol, onde e como quiser.</p>
            <a href="www.alura.com.br" class="container__botao secundario__botao">Assinar o Combo mais</a>
        </div>
        <img src="./assets/img/Telas.png" alt="Tela do alura+ e do alura lingua" class="secundario__imagem">
    </section>
    <section class="container secundario">
        <img src="./assets/img/Notebook.png" alt="imagem de um notebook com a plataforma do Alura aberto">
        <div class="container__descricao">
            <h2 class="descricao__titulo">Baixe seus cursos</h2>
            <p class="descricao__texto">Baixe e assista quando e onde quiser. Assim, seus favoritos estão sempre com você, até mesmo sem internet.</p>
        </div>
    </section>
    <section class="dispositivos">
        <h2 class="descricao__titulo">Disponível nos seus dispositivos favoritos</h2>
        <div class="dispositivos__imagens">
          <div class="dispositivos__item">
            <img class="dispositivos__imagem" src="./assets/img/tv.png" alt="Icone de uma televisão">
            <p class="dispositivos__legenda">TV</p>
          </div>
          <div class="dispositivos__item">
            <img class="dispositivos__imagem" src="./assets/img/computador.png" alt="icone de um computador">
            <p class="dispositivos__legenda">Computador</p>
          </div>
          <div class="dispositivos__item">
            <img class="dispositivos__imagem" src="./assets/img/celular.png" alt="icone de um celular">
            <p class="dispositivos__legenda">Celular</p>
          </div>
        </div>
      </section>

o problema foi q eu me empolguei e acabei fazendo a parte de baixo também kkk

.dispositivos {
    height: 50vh;
    margin-top: 40px;
    padding-bottom: 10px;
    text-align: center;
  }
  .dispositivos__imagens {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
  }
  .dispositivos__imagem {
    margin: 0px 20px;
    max-width: 300px;
  }
  .dispositivos__legenda {
    text-align: center;
    color: var(--primary-branco);
    margin-top: 32px;
  }
1 resposta
solução!

Oi Aécio, tudo bem?

Muito obrigada por compartilhar com a gente o seu código! E que bom que você se empolgou :D

Parabéns por praticar! Continue os bons estudos :D

Um abraço.