Como colocar texto e imagem lado a lado no HTML?

Parece que o que você realmente deseja são dois pedaços distintos de conteúdo, cada um com uma imagem e algum texto. Sugiro colocar a imagem dentro do

elemento - está embutido e

são blocos. Coloque a imagem primeiro e depois a flutue para a esquerda, como você tentou. Isso deve alcançar o que você procura.

Como colocar uma imagem do lado de um texto?

Bora aprender a colocar uma imagem do lado de um texto! A grande ideia por trás dessa técnica, de deixar a imagem do lado de um texto É que a imagem é um elemento de bloco, ou seja, ela possui um display block como padrão Por isso que ela ocupa 100% da largura, e o texto é jogado para baixo dela

Como colocar o texto embaixo da foto?

O texto fica embaixo da foto ou eu consigo colocar a primeira frase do texto no mesmo nível que o topo da imagem da esquerda. Tentei usar o display:block, até certo ponto funciona, porquê fica do lado da imagem, mas fica como coluna. Não fica igual o da imagem acima, com o texto embaixo da foto.

Por que fazer isso com CSS?

Depois só fazer o resto com CSS, se for isso que você quer, não tem muito segredo. Fiz algo assim, que é bem próximo do que quer. Olha se lhe ajuda. Obrigado por contribuir com o Stack Overflow em Português!