Kontaktformular verhält sich nicht responsive

    Hallo

    Im Layout "Album Responsive" verhält sich das Kontaktformular (im Gegensatz zu anderen Layouts) auf dem Tablet im Hochformat nicht responsive. Zu sehen auch am PC - wenn man das Browser-Fenster mit der Maus ganz schmal zusammen zieht.
    Das heisst, das Kontaktformular überlappt dann rechts die Layoutgrenze!

    Hier der Link zur Voransicht der Beta-Kundensite...: http://www.hb4web.ch/beta/mariograf_v2/kontakt.php

    Ich würde mich sehr freuen, wenn mir da jemand helfen könnte...

    Herzlichen Dank
    Hannes

    Freundlicher Gruss

    Hannes

    Hallo,

    das Formular ist schon responsive, aber es sind generell in Zeta Producer Mindest-Feldlängen für die Formularfelder eingestellt (über die Formular-Konfiguration). Und da Sie das Formular in einem 2-Spalter platziert haben, kann es in dieser Kombination vorkommen, dass die Spalte schmaler wird, wie die Formular-Feldbreite und dann sieht das nicht gut aus.

    Ich würde das Formular daher lieber in eine eigene Reihe mit nur einer Spalte verschieben. Dann sieht es immer gut aus.

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

    Hallo

    Das Formular in eine einzelne Spalte kann ich so nicht platzieren, das sieht dann ziemlich vereinsamt aus. Ausserdem werden die Felder auch dann noch abgeschnitten, respektive ragt das Formular über den Layoutrand hinaus, wenn ich die Felder über 295px einstelle. Ich hab das meinem Kunden zur Anschauung mal kurz hochgeladen, aber das will der Kunde so nicht. Zuviel leerer Platz auf der Seite!

    Die Frage nun lautet, warum wird der Text im schmalen Hochformat nicht dynamisch nach unten links verschoben? Das funktioniert ja sonst auf dieser gesamten WebSite auch, die ich inhaltlich über alle Seiten per CMS-Widget erstellt habe.

    Auf folgender Website (habe ich mit "Smart Responsive" erstellt) wird der rechts neben dem Kontaktformular stehende Text - im schmalen Hochformat - doch ebenfalls dynamisch nach unten links verschoben...:
    http://www.hess-restaurant.ch/kontakt-01.php

    Freundliche Grüsse
    Hanns

    Freundlicher Gruss

    Hannes

    Hallo,

    unterschiedliche Layouts haben unterschiedliches verhalten. Das können wir aber ggf. anpassen. Leider finde ich Ihr ursprüngliches Formular mit dem 2-Spalte nicht mehr, sonst hätte ich Ihnen evtl. einen CSS-Code erstellen können. Könnten Sie das ursprüngliche Formular in den 2-Spalten nochmal hochladen?

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

    OK, danke. Nachfolgender Code sollte helfen. Evtl. müssen Sie die Felbreiten des Formulars noch etwas anpassen. Das Nachrichtenfeld z.B. ist im Moment noch zu breit.

    Der Code bewirkt, dass bereits ab einer Fensterbreite von 1023px auf die 1-Spaltige Darstellung umgeschaltet wird:

    • Klicken Sie im Menü Website auf "Einstellungen"
    • Klicken Sie auf CSS
    • Fügen Sie folgende Textzeilen (ohne Überschrift und ohne Zeilennummern – am besten über das Dokumente-Icon rechts oben im Quellcode-Kasten kopieren) in das Feld "CSS" ein und schließen Sie den Dialog dann mit Klick auf "OK"
    CSS
    @media only screen and (max-width: 1023px){
    .responsivelayout div.zpRow div.zpColumn{
      width: 100% !important;
      margin-left: 0 !important;
      margin-bottom: 40px !important;
      float: none !important;
    }
}

    Anschließend müssen Sie evtl. Ihre Seiten neu erstellen (Erweitert > Erstellen > Alle Seiten erstellen) und ggf. veröffentlichen.

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

    Herzlichen Dank Herr Seiz!

    Das hat perfekt geklappt...
    Musste nur noch <style> resp. </style> zum Anfang und Schluss einfügen.

    Freundliche Grüsse
    Hannes

    Freundlicher Gruss

    Hannes

    OH, sorry, das <style> hatte ich vergessen. Gut dass Sie das gemerkt haben und lösen konnten.

    Freundliche Grüße
    Stefan S. (Zeta Producer-Support)

Jetzt mitmachen!

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

Benutzerkonto erstellen Anmelden