1

Using Jijna2, I'm trying to make a responsive HTML email template which is almost simple

<!DOCTYPE html>
<html>
    <body>
    <p><strong>Hello</strong>,</p>
    <p>Below are the deals running on <a href="https://www.{{ url }}.com">{{ url }}</a> at <strong>{{ date }}</strong>:</p>
    <p>&nbsp;</p>
    
    <ul>
        {% for image in images %}
          <a href="{{ image }}">
            <img src="{{ image }}" width=500" height="200">
          </a>
        {% endfor %}
    </ul>
    <p><strong>Regards,</strong></p>
    <p>Team</p>
    </body>
</html>

That's what is shown currently:

enter image description here

and during full screen:

enter image description here

How to make it responsive in this case and keep the display of images one by one. not side by side during full screen or mobile screen!

davidism
  • 121,510
  • 29
  • 395
  • 339