1. Herzlich willkommen bei WPDE.org, dem grössten und ältesten deutschsprachigen Community-Forum rund um das Thema WordPress. Du musst angemeldet oder registriert sein, um Beiträge verfassen zu können.
    Information ausblenden

Problem mit Contact Form 7

Dieses Thema im Forum "Plugins und Widgets" wurde erstellt von StefanTr, 16. März 2017.

  1. StefanTr

    StefanTr Well-Known Member

    Registriert seit:
    12. Juni 2015
    Beiträge:
    77
    Zustimmungen:
    0
    Hallo,
    ich habe ein Problem mit der Ausrichtung der Eingabefelder wie in beiliegendem Screesnhot beschrieben.
    Die CSS-Funktionen sind wie folgt:

    * Definiert das Kontaktformular*/
    .form_half {
    width: 49.5%;
    float: left;
    margin-right: 1%;
    padding-left: 70px !important;
    padding-top: 20px;
    }

    .form_half_last {
    margin-right:0;

    }

    input.wpcf7-form-control.wpcf7-text {
    margin-left: 20px;
    }

    .form_half br
    {
    float:left;
    display:none;
    }
    .form_half label.clr
    {
    clear:both;
    }
    .form_half label,
    .form_half.text
    {
    float:left;

    }
    .form_half input.col_0
    {
    float:left;
    }

    Kann mir jemand weiter helfen wie ich ALLE Eingabefelder einheitlich in der Vertikalen ausrichten kann?
     

    Anhänge:

  2. Doerfi

    Doerfi Member

    Registriert seit:
    16. März 2017
    Beiträge:
    5
    Zustimmungen:
    0
    Hallo Stefan,

    vielleicht hilft dir die Möglichkeit zur absoluten Positionierung eines Elements. Hierzu musst du lediglich in dein

    input.wpcf7-form-control.wpcf7-text{
    position: absolute;
    left: 200px;

    }

    und unter Umständen auch noch:
    top: 150px;

    EDIT: einfügen

    Vorsicht ist nur geboten, da sich die Elemente dann überlappen können.

    Ich hoffe das hilft dir weiter


    Grüße

    Simon
     
    #2 Doerfi, 16. März 2017
    Zuletzt bearbeitet: 16. März 2017
  3. StefanTr

    StefanTr Well-Known Member

    Registriert seit:
    12. Juni 2015
    Beiträge:
    77
    Zustimmungen:
    0
    Hallo Simon,
    das funktioniert leider nicht. Die Eingabefelder referenzieren sich immer noch auf den Text - anbei ein Screenshot.

    Contact-Form_02.JPG

    Das muss doch irgendwie lösbar sein - anbei nochmals ein Screenshot mit dem Div-Container.
    Hat jemand noch einen Tip?
    contact-form_02.png
     
  4. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Gib den label einfach alle die gleiche Breite.
     
  5. StefanTr

    StefanTr Well-Known Member

    Registriert seit:
    12. Juni 2015
    Beiträge:
    77
    Zustimmungen:
    0
    Hallo zusammen,
    danke für Eure Rückmeldungen:) - das scheint mir sinnvoll mit der gleichen Breite. Aber ich habe nun in den ganz oben aufgeführten CSS-Eigenschaften mal nacheinander width: 100px; probiert, aber es ändert sich nichts.
    In den eigentlichen Plugin-Einstellungen muss ich doch nichts ändern oder?
    <div class="form_half"> Vorname:* <br />
    [text* Vorname size:50] </div>
    <div class="form_half"> Firma: <br />
    [text Firma size:50] </div>

    Kann mir da jemand von Euch nochmals einen Tip geben, wo die Breite hin sollte?
     
  6. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Die Größe muss nicht ins Input-Feld, sondern ins Label.
    Versuch es mal anhand des Beispiels
    <div class="form_half">Vorname:*</div>
    <div class="form_half">[text* Vorname] </div>

    Ich weiß allerdings nicht wie bei dir die Class form_half definiert ist.
     
  7. StefanTr

    StefanTr Well-Known Member

    Registriert seit:
    12. Juni 2015
    Beiträge:
    77
    Zustimmungen:
    0
    Hier ist der Link zur Website:
    http://gaertnerei-huber-oppenau.de/ihre-nachricht-an-die-gaertnerei-huber-in-oppenau/

    Die Anweisungen von form_half stehen ganz oben in meiner ersten Nachricht - Danke schon mal für die Hilfe...

    P.S.: Ich habe dann eh noch ein anderes Problem dabei - und zwar verschiebt es mir die ganzen Zeilen ab Vornamen unterhalb des Textareas, anstatt diese alle untereinander unter dem Vornamen zu platzieren...
    Wenn hier noch jemand einen Tip hat ?
     
  8. SirEctor

    SirEctor Well-Known Member
    Ehrenmitglied

    Registriert seit:
    28. Oktober 2008
    Beiträge:
    12.361
    Zustimmungen:
    427
    Dann setz es mal so um, wie ich es in #8 geschrieben habe.
     
  9. StefanTr

    StefanTr Well-Known Member

    Registriert seit:
    12. Juni 2015
    Beiträge:
    77
    Zustimmungen:
    0
    Das erwirkt dann dass die Zeile unterhalb des Textes rutscht - der Text soll ja aber links vom Eingabefeld stehen.
    Anbei habe ich mal einen Screenshot gemacht, wie es mit der Änderung #8 dann aussieht... Contact-Form_03.JPG
     
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden
  1. Diese Seite verwendet Cookies, um Inhalte zu personalisieren, diese deiner Erfahrung anzupassen und dich nach der Registrierung angemeldet zu halten.
    Wenn du dich weiterhin auf dieser Seite aufhältst, akzeptierst du unseren Einsatz von Cookies.
    Information ausblenden