<div className="containerConversa2">
<div className="conversa">
<div className="preenchidaAutomaticamente">teste </div>
</div>
</div>
Tenho essa estrutura em html que vai ser preenchida automaticamente,a div com classe preenchidaAutomaticamente vai ser em forma de coluna cada vez que chegar uma mensagem,daí quero fazer com que se for a classe transmissor,ela fique alinhada totalmente à direita,e se for classe receptor totalmente à esquerda,algo parecido com as mensagens do whats app , as mensagens recebidas se alinham na esquerda e as que são enviadas ficam na direita,como posso fazer isso usando css? o css da classe containerConversa2 é esse abaixo
.containerConversa2{
display:flex;
flex-direction:column;
}