Hilfe benötigt bei HTML Impressum für e-Mial Signatur.

  • Hallo ihr Lieben,

    ich benötige eine E-Mail Signatur in html Format.

    Ich möchte gerne folgenden Muster für die Anregung nutzen und es praktisch gleich gestalten. Allerdings kenne ich mich in html nicht gut aus. Für einen Code wäre ich sehr dankbar. Die Hintergundfarbe sollte auch grün oder hellgrün sein.

    Danke vielmals.


    html-seminar.de/woltlab/attachment/1968/

  • Das ist einfach.

    Mit ein bisschen (weiterem) CSS in den jeweiligen 'style="..." ' Elementen kann man das beliebig aufhübschen.

  • Das ist einfach.

    Mit ein bisschen (weiterem) CSS in den jeweiligen 'style="..." ' Elementen kann man das beliebig aufhübschen.


    Klappt nicht ganz das rechte Teil ist irgendwie immer unten:

    html-seminar.de/woltlab/attachment/1969/

  • Bei HTML-Mails würde ich alles auf ein Minimum an CSS setzen, da viele Mail-Clients nur sehr dürftig CSS verstehen. In dem Falle würde ich auf eine Tabelle setzen, auch wenn das nicht toll ist. Aber das können die Clients wenigstens.

  • dann füge bitte mal den Code flex-wrap: nowrap; in das Style-Element des ersten (äußeren) div's hinzu.

    ... So soll diese Zeile dann aussehen.

    Code
    <div style="display: flex; justify-content: space-between; flex-wrap: nowrap; background-color: #a2c217; font-size: 1em; color: #ffffff; padding: 5px;">

    Gibt aber auch andere Möglichkeiten... kommt darauf an, was du haben willst und wie das 'Endprodukt' aussehen soll.

  • dann füge bitte mal den Code flex-wrap: nowrap; in das Style-Element des ersten (äußeren) div's hinzu.

    ... So soll diese Zeile dann aussehen.

    Code
    <div style="display: flex; justify-content: space-between; flex-wrap: nowrap; background-color: #a2c217; font-size: 1em; color: #ffffff; padding: 5px;">

    Gibt aber auch andere Möglichkeiten... kommt darauf an, was du haben willst und wie das 'Endprodukt' aussehen soll.


    Bin für alles offen, sollte halt kompakt sein. Hast du einen guten Vorschlag, damit die Clients alles gut darstellen?

    Danke im Voraus.

  • dann füge bitte mal den Code flex-wrap: nowrap; in das Style-Element des ersten (äußeren) div's hinzu.

    ... So soll diese Zeile dann aussehen.

    Code
    <div style="display: flex; justify-content: space-between; flex-wrap: nowrap; background-color: #a2c217; font-size: 1em; color: #ffffff; padding: 5px;">

    Gibt aber auch andere Möglichkeiten... kommt darauf an, was du haben willst und wie das 'Endprodukt' aussehen soll.

    Haben hinzugefügt, immer noch das selbe Problem!

  • Das sollte aber klappen... mit welchem Mailprogramm arbeitest du denn?

    Ansonsten kann dir vielleicht der Vorschlag von m.scatello weiterhelfen... eine Tabelle.

    Das könnte dann so aussehen.

  • Ich seh gerade... da verrutscht die vertikale Ausrichtung etwas, da bei der Tabelle in in den Zellen das Default auf 'middle' gesetzt ist.

    Ergänze den 'style' der beiden <td>Elemente um vertical-align: top;, dann sollte es passen.

  • Ich seh gerade... da verrutscht die vertikale Ausrichtung etwas, da bei der Tabelle in in den Zellen das Default auf 'middle' gesetzt ist.

    Ergänze den 'style' der beiden <td>Elemente um vertical-align: top;, dann sollte es passen.

    Danke vielmals werde es ausprobieren. Ich versuche in Shopify meine Email einzurichten via html.

  • Das sollte aber klappen... mit welchem Mailprogramm arbeitest du denn?

    Ansonsten kann dir vielleicht der Vorschlag von m.scatello weiterhelfen... eine Tabelle.

    Das könnte dann so aussehen.

    Danke für den Code, jetzt passt alles. Super gemacht!

  • Bei E-Mails muss man leider immer noch priorisiert auf Table-Layouts setzen, allein schon wenn man die M$-Clients berücksichtigen will ( was man wohl leider tun sollte ). Gerade Outlook kann am besten mit Word-Formatierungen arbeiten und wer die mal gesehen hat, dürfte sich gedanklich von sauberen, modernen Quelltexten in HTML-Mails verabschieden.


    Falls ihr Newsletter erhaltet, schaut euch mal deren Quelltext an, gibt kaum einen ohne Tables... ;)

  • Danke, auf dem Desktop sah die o.g. Signatur gut aus, aber auf smartphone verrückt und komische Verlinkung bei halber Telefon Adresse.

    Wie kann ich das besser machen?

    Danke

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!