1 block responsive template

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Responsive Email Template</title>

    <style>

        /* Inline CSS styles for compatibility with email clients */

        @media only screen and (max-width: 600px) {

            /* Adjust styles for mobile devices */

            .container {

                width: 100% !important;

                padding: 0 !important;

            }

            .banner img {

                width: 100% !important;

                height: auto !important;

            }

        }

    </style>

</head>

<body style="margin: 0; padding: 0; font-family: Arial, sans-serif;">

    <!-- Container table for email content -->

    <table class="container" role="presentation" width="600" border="0" cellpadding="0" cellspacing="0" align="center">

        <tr>

            <td style="padding: 20px;">

                <!-- Banner section with responsive image -->

                <div class="banner">

                    <img src="https://via.placeholder.com/600x200" alt="Banner Image" style="display: block; width: 100%; height: auto;">

                </div>

                <!-- Content section -->

                <div style="padding: 20px; background-color: #f9f9f9;">

                    <h2>Welcome to Our Newsletter</h2>

                    <p>Thank you for subscribing to our newsletter. Here's the latest updates...</p>

                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam tristique massa eu orci hendrerit, eget varius justo interdum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>

                    <p>Nunc malesuada, magna nec euismod varius, velit risus maximus libero, nec consequat arcu sem a ex. Duis sit amet ullamcorper nibh. Nulla facilisi. Integer eu lectus sit amet augue hendrerit facilisis.</p>

                    <p>Quisque euismod ex sit amet neque iaculis, at vehicula velit consequat. Sed id elit ac nibh mollis hendrerit.</p>

                </div>

            </td>

        </tr>

    </table>

</body>

</html>