# Responsive Email Templates

**URL:** <https://forum.shopware.com/t/responsive-email-templates/94982>\
**Category:** Shopware 5\
**Created:** [27. Juni 2022 um 07:20 UTC](https://forum.shopware.com/t/responsive-email-templates/94982 "2022-06-27T07:20:19Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![jn93](https://avatars.discourse-cdn.com/v4/letter/j/b4bc9f/32.png) [@jn93](https://forum.shopware.com/u/jn93)\
**Post date:** [27. Juni 2022 um 07:20 UTC](https://forum.shopware.com/t/responsive-email-templates/94982/1 "2022-06-27T07:20:19Z")

</div>

Hallo zusammen,

ich habe gerade ein neues Mail Template erstellt und dazu eine Vorlage für responsive Mails verwendet. Die Mail wird aber leider nicht versendet mit der Fehlermeldung „Die Bestätigungs-Mail konnte nicht versendet werden“.

Im HTML-Header habe ich folgendes:

```auto
<meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta name="x-apple-disable-message-reformatting">
  <!--[if !mso]><!-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <!--<![endif]-->
  <title></title>
  <!--[if mso]>
  <style type="text/css">
    table {border-collapse:collapse;border:0;border-spacing:0;margin:0;}
    div, td {padding:0;}
    div {margin:0 !important;}
  </style>
  <noscript>
    <xml>
      <o:OfficeDocumentSettings>
        <o:PixelsPerInch>96</o:PixelsPerInch>
      </o:OfficeDocumentSettings>
    </xml>
  </noscript>
  <![endif]-->
  <style type="text/css">
    @media screen and (max-width: 350px) {
      .three-col .column {
        max-width: 100% !important;
      }
    }
    @media screen and (min-width: 351px) and (max-width: 460px) {
      .three-col .column {
        max-width: 50% !important;
      }
    }
    @media screen and (max-width: 460px) {
      .two-col .column {
        max-width: 100% !important;
      }
      .two-col img {
        width: 100% !important;
      }
    }
    @media screen and (min-width: 461px) {
      .three-col .column {
        max-width: 33.3% !important;
      }
      .two-col .column {
        max-width: 50% !important;
      }
      .sidebar .small {
        max-width: 30% !important;
      }
      .sidebar .large {
        max-width: 70% !important;
      }
    }
  </style>

```

Der HTML Footer ist leer.

Im Mail Template selbst sind noch diese Anweisungen für MS Outlook mit drin  
`<!--[if !mso]>`  
machen die vielleicht Probleme? Oder hat jemand eine andere Idee?

---

<div class="post-metadata">

**Author:** ![Max\_Shop](https://avatars.discourse-cdn.com/v4/letter/m/58f4c7/32.png) [@Max\_Shop](https://forum.shopware.com/u/Max_Shop)\
**Post date:** [27. Juni 2022 um 13:17 UTC](https://forum.shopware.com/t/responsive-email-templates/94982/2 "2022-06-27T13:17:17Z")

</div>

Die meisten E-Mail-Programme sind zwar up-to-date, aber wer in E-Mails mit media query arbeitet, der schreit förmlich nach Ärger. Persönliche Meinung.