---
url: "/de/emailify/design/borders.md"
description: "Du kannst Rahmen auf deine Layout-Elemente anwenden und Trennlinien zwischen deine Inhaltsebenen einfügen."
---

# Rahmen und Trennlinien in deine E-Mail-Layouts einfügen

> Du kannst Rahmen auf deine Layout-Elemente anwenden und Trennlinien zwischen deine Inhaltsebenen einfügen.

## Rahmenlinien zu deinen Layout-Elementen hinzufügen {#adding-border-strokes-to-your-layout-elements}

[Video](/assets/videos/emailify/design/adding-borders.mp4)

Du kannst Ebenen in deinen E-Mail-Designs (zum Beispiel Row, Column, Button usw.) einen durchgehenden Rahmen geben: Klick auf die Ebene und wende eine Figma-Kontur (Stroke) darauf an. Sie wird im fertigen, aus Emailify exportierten HTML automatisch als CSS-Rahmen übernommen.

Für etwas Abstand zwischen dem Rahmen und dem Inhalt deiner Ebene kannst du nach dem Anwenden des Rahmens [Padding](/de/emailify/design/padding) auf diese Ebenen anwenden.

> **Warning:** Beachte, dass **E-Mail-Clients keine Verlaufsrahmen unterstützen**. Wenn du für deine Figma-Kontur eine Verlaufsfüllung verwendest, wird im fertigen HTML-Export stattdessen die erste Volltonfarbe deines Verlaufs verwendet.

## Trennlinien zwischen deine Inhaltsebenen einfügen {#adding-divider-lines-between-your-content-layers}

[Video](/assets/videos/emailify/design/add-divider-lines.mp4)

Wenn du in deinen E-Mail-Layouts eine Trennlinie zwischen Inhaltsebenen innerhalb einer Column brauchst, kannst du ein spezielles Emailify-Trennelement einfügen: Klick auf deine „Column“-Ebene, wähl im Dropdown-Menü Quick Add unten im Plugin den Eintrag „Divider“ aus und klick dann auf den Button **Add +**, um die Trennlinien-Ebene in deine Column einzufügen.

Nachdem die Trenn-Ebene zu deiner Column hinzugefügt wurde, kannst du sie in deinem Ebenen-Panel per Drag-and-drop verschieben, um festzulegen, zwischen welchen Ebenen sie liegt. Ihre Größe passt du über die **Height** der Ebene im Figma-Eigenschaften-Panel an, ihre Hintergrundfarbe, indem du die **Fill** deiner Ebene in Figma auf eine beliebige Volltonfarbe änderst.

> **Warning:** Beachte, dass **E-Mail-Clients keine Verlaufsrahmen unterstützen**. Wenn du für deine Trennlinie eine Verlaufsfüllung verwendest, wird im fertigen HTML-Export stattdessen die erste Volltonfarbe deines Verlaufs verwendet.

### Innenabstand zu deinen Trennlinien-Ebenen hinzufügen {#adding-inner-padding-to-your-divider-line-layers}

[Video](/assets/videos/emailify/design/divider-padding.mp4)

Du kannst deinen Trennlinien optional Innenabstand geben: Wähl bei geöffnetem Panel **Settings** eine Emailify-Trenn-Ebene in deiner E-Mail aus, aktiviere den Schalter **Inner Padding** und trag die Padding-Werte ein, die auf die ausgewählte Trenn-Ebene angewendet werden sollen.

Dadurch wird beim Rendern ins HTML zusätzlicher „innerer“ Abstand in deiner Trenn-Ebene eingefügt. So kannst du Padding-Werte für bestimmte Textebenen in deiner Column festlegen, ohne andere Ebenen zu beeinflussen.

> **Tip:** Du kannst das Padding jeder Emailify-Trenn-Ebene auf Mobilgeräten optional überschreiben: Aktiviere den Schalter **Mobile Padding** und trag die Padding-Werte ein, die auf die ausgewählte Trenn-Ebene angewendet werden sollen. Sie sind nur sichtbar, wenn deine HTML-E-Mail auf einem Mobilgerät angezeigt wird.

## Eckenradius für Hintergründe deiner Layout-Elemente hinzufügen {#adding-border-radius-for-backgrounds-to-your-layout-elements}

[Video](/assets/videos/emailify/design/column-border-radius.mp4)

Wenn dein Row- oder Column-Layout-Element eine Hintergrundfüllung hat (ohne Kontur), kannst du deinem Hintergrund abgerundete Ecken geben: Klick auf deine Ebene und leg in Figma über die Eigenschaft **Corner Radius** einen Wert für die abgerundeten Ecken fest.

> **Note:** Hinweis für bildbasierte Inhalte: Wenn du einen mobilen Eckenradius anwendest, der kleiner ist als der Desktop-Radius, wird das Bild als quadratisches JPG exportiert, damit der gesamte Bildbereich erhalten bleibt. So kann auf Mobilgeräten der kleinere Radius angewendet werden, allerdings ist der Radius dann nicht fest ins PNG eingebettet. Outlook stellt das Bild deshalb mit eckigen Ecken dar, weil es keinen CSS-Eckenradius unterstützt.

> **Warning:** Beachte, dass **E-Mail-Clients keinen Eckenradius für Rahmenlinien unterstützen**. Wenn du einen Eckenradius auf ein Layout-Element mit Figma-Kontur anwendest, werden im fertigen HTML-Export stattdessen eckige Rahmen ohne Rundung dargestellt.

### Wichtige Hinweise zum Eckenradius mit Konturen {#important-notes-on-using-border-radius-with-strokes}

Der Eckenradius funktioniert zuverlässig bei **Column**-Ebenen, die ebenfalls eine Kontur haben. Bei **Row**-Ebenen funktioniert er dagegen nicht, weil das HTML-Tabellen sind (die leider keinen Eckenradius für Konturen unterstützen).

Leider wird der [Eckenradius in keiner Outlook-Version unterstützt](https://www.caniemail.com/features/css-border-radius/). Diese Clients zeigen unabhängig vom Setup immer eckige Ecken.

Die besten Ergebnisse erzielst du, wenn du den Eckenradius direkt auf die Emailify-**Column**-Ebene mit der Kontur anwendest statt auf eine Row oder einen Wrapper. Denk aber daran, dass die abgerundeten Ecken in keiner Outlook-Version dargestellt werden.