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

Deixar imagem e parágrafos lado a lado com display

Vi um outro tópico falando da mesma coisa, mas a explicação não funcionou no meu código.

Na minha visão, não precisaria usar a propriedade float para alinhar texto e imagem. Então tentei usar display inline-block, mas não funcionou.(https://cdn1.gnarususercontent.com.br/1/746937/4fb037c9-32fc-4a65-9751-591c31f2e1fc.png)

Apenas o primeiro

fica alinhado com a imagem.

Depois disso tentei usar "vertical-align: top", pra ver se o texto subia, mas, novamente, apenas o primeiro

subiu.(https://cdn1.gnarususercontent.com.br/1/746937/9a8b7d3d-e2c0-4d88-a23d-785d1cfa91e4.png)

Eu gostaria de saber qual o problema com meu código.

*Obs: *O elemento pai dos parágrafos e da imagem é uma

com 940px de largura *A imagem está com dimensões 150px x 150px com "display: inline-block" *O parágrafo está com "width: 600px" e "display=inline-block"
1 resposta
solução!

Seria bom se voce colocasse essa parte do seu codigo para entender melhor como fez, mas pela imagem imagino que esteja assim:

<div class="PAI">
    <img src="#" alt="IMAGEM">
    <p>Paragrafo 1</p>
    <p>Paragrafo 2</p>
</div>

Sem usar o float uma solução rapida voce poderia fazer assim que deve funcionar com display: Flex

<!-- Usando uma div exclusiva para os paragrafos -->
<div class="PAI">
    <img src="" alt="">
    <div class="Paragrafos">
        <p>Paragrafo 1</p>
        <p>Paragrafo 2</p>
    </div>
</div>

<!-- OU dessa outra forma usando uma div para cada "coluna" que vc queira -->
<div class="PAI">
    <div class="imagens">
        <img src="" alt="">
    </div>
    <div class="Paragrafos">
        <p>Paragrafo 1</p>
        <p>Paragrafo 2</p>
    </div>
</div>

Como nao testei pode ser que exista soluções melhores pro seu caso, mas acredito que display:flex resolva

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