HTML, Imágenes y saltos de línea

[senseeye3led]

Una duda básica que tengo de HTML, quiero insertar una imagen y lo hago de la siguiente manera:

Código HTML:

<p><img style="max-width: 100%; width: auto; height: auto; display: block; margin-left: 4%; margin-right: auto;" src="https://my_domain/img/newsletter/image.jpg" alt="Mi Alt" align="left" /></p> 

Después añado varios <br/> para poder escribir el texto debajo de la imagen.

En la pantalla del PC lo veo correctamente, ya que puedo saber cuandos <br/> poner; pero si lo veo desde un móvil son demasiados <br/> por lo que queda mucho espacio entre la imagen y el texto.

¿Cómo se hace para insertar una imagen en un HTML, realizar un "salto de linea" / "intro" tras la imagen y después añadir el texto?

No sé si se puede hacer de manera generica sin depender del tamaño de las pantallas.

[prueba230683]

Es preferible que utilices márgenes de CSS en lugar de la etiqueta <br>.

Código CSS:

img {
    margin-bottom: 100px;
}
 

La etiqueta <br> está pensada únicamente para texto, y el texto suele ser redimensionado por los navegadores móviles.