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

[Dúvida] Como fazer itens em uma mesma linha

Referente ao curso HTML e CSS: cabeçalho, footer e variáveis CSS, no capítulo Navegando entre páginas e atividade Desafio: crie uma página currículo!

por Maria Beatriz Reis Fogolin de Godoy
| 96.2k xp | 54 posts
Estagiária

Olá!

Minha dúvida é sobre como posso fazer com que a Conclusão prevista fique na mesma linha que análise e desenvolvimento de sistemas mas, estando ao final na direita Insira aqui a descrição dessa imagem para ajudar na acessibilidade

O código em html e css estão abaixo:

       <h1 class="__curriculo_formacao_titulo"> Formações acadêmicas</h1>
        <h6 class="__curriculo_formacao"> Faculdade de Informática e Administração Paulista</h6>
        <p class="__curriculo_formacao"> Análise e Desenvolvimento de Sistemas                Conclusão prevista: julho de 2025 </p> 

.__curriculo_formacao {
    margin: 10px 50px;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    text-indent: 20px;
    justify-content: space-between;
    align-items: end;
    
}
2 respostas
solução!
por Matheus Nazareth Ferreira
| 44.4k xp | 2 posts

A forma que eu resolveria esse problema seria ao invés de utilizar um paragrafo eu utilizaria 2 assim você cria dois itens separados

<p class="__curriculo_formacao"> Análise e Desenvolvimento de Sistemas</p><p class="__curriculo_formacao">Conclusão prevista: julho de 2025 </p>

Depois crie uma DIV e coloque uma classe ( utilize o nome que achar melhor ) 

<body>
    <h1 class="__curriculo_formacao_titulo"> Formações acadêmicas</h1>
    <h6 class="__curriculo_formacao"> Faculdade de Informática e Administração Paulista</h6>
<div class="__texto_final_a_direita">
    <p class="__curriculo_formacao"> Análise e Desenvolvimento de Sistemas</p><p class="__curriculo_formacao">Conclusão prevista: julho de 2025 </p> 
</div>
</body>

e no CSS utilize o seguinte código 

.__texto_final_a_direita{

    display: flex;
   flex-direction: row;
   justify-content: space-between;
    
}

Acredito que assim o texto deve se manter na mesma linha e ao final, possivelmente existem outras formas de ajustar isso mas como estou no começo ainda não tenho tanto domínio técnico, para propor outras soluções, porem espero ter ajudado !!

por Maria Beatriz Reis Fogolin de Godoy
| 96.2k xp | 54 posts
Estagiária

Opa Matheus, me ajudou mesmo, muito obrigada!