Contact Form 7 zeigt Formular nicht richtig an

Jens_Bo

Ich habe ein Problem mit Contact Form7.
Aus irgendeinem Grund wird das Formular mit einem riesigen Abstand nach oben auf der jeweiligen Seite ausgegeben.

Hier mal der Link zur betreffenden Seite:http://www.die-tipprunde.com/tippformular/

http://www.die-tipprunde.com/tippformular/ Wenn ich vor den Formular-Shortcode Text eingebe verringert sich dieser Abstand, so als ob CF7 das Formular absolut unten im Content-Bereich positioniert.

Hier mal der CF7-Code: http://l.facebook.com/l.php?u=http%3…c_WthCJCgUQ&s=1

und die dazugehörigen CSS-Angaben: http://pastebin.com/4EJCkMqk

Leider konnte mir Firebug auch nicht weiterhelfen.
Vielleicht kann mir hier jemand helfen, ich weiß leider nicht mehr weiter.

Besten Dank im Voraus.

PS: kann man es irgendwie unterbinden, dass CF7 alles nochmal in <p> Tags packt?

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

Gerd-E.

Hi Jens_Bo,

das Problem entsteht durch deine Formatierung.

Bei CF7 sehen die einzelnen p-tags bei mir so aus

Code

<p>Ihr Name (Pflichtfeld)
<br>


<span class="wpcf7-form-control-wrap your-name">
<input class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" type="text" aria-invalid="false" aria-required="true" size="40" value="" name="your-name">




</span>




</p>

Alles anzeigen

Diese Klassen kann ich doch dann per CSS ansprechen.

Hast du deine Variante mit einem Standard-Theme probiert?

Jens_Bo

Das ist ja auch ein Problem. Ich WILL garnicht, dass CF7 alles nochmal in <p> Tags packt.

Das Problem ist einfach nur der Abstand des Ganzen nach oben. Lösche ich den clearfix, ist das Formular zwar richtig positioniert, aber es sieht halt alles käse aus.

SirEctor

Zitat von Jens_Bo

Lösche ich den clearfix, ist das Formular zwar richtig positioniert, aber es sieht halt alles käse aus.

Das ist das, was Gerd-E. angesprochen hat. Deine Formatierung sieht sehr wirr aus.

So müsstest Du es in etwa machen:

HTML

<div class="tippformular">
<p style="
    height: 30px;
">   <label class="input-label" for="Name">Name*</label>
   <span class="wpcf7-form-control-wrap name"><input type="text" name="name" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required input-feld" aria-required="true" aria-invalid="false" placeholder="Dein Name"></span></p>
<p style="
    height: 30px;
">   <label class="input-label" for="Verein">Verein*</label>
   <span class="wpcf7-form-control-wrap verein"><input type="text" name="verein" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required input-feld" aria-required="true" aria-invalid="false" placeholder="Dein Verein"></span></p>
<p style="
    height: 30px;
">   <label class="input-label" for="ID">ID*</label>
   <span class="wpcf7-form-control-wrap identification"><input type="text" name="identification" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required input-feld" aria-required="true" aria-invalid="false" placeholder="Deine ID"></span></p>
<p style="
    height: 30px;
">   <label class="input-label" for="Email">Email-Adresse*</label>
   <span class="wpcf7-form-control-wrap email"><input type="email" name="email" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email input-feld" aria-required="true" aria-invalid="false" placeholder="Deine Email-Adresse"></span></p>




<div class="radio-container">
      <label class="label-radio" for="Spiel1"><br>
         RB Leipzig - VfR Aalen<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-792"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-792" value="1 (15 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (15 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-792" value="0 (35 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (35 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-792" value="2 (50 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (50 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel2"><br>
         Chemnitzer FC - VfL Osnabrück<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-225"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-225" value="1 (22 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (22 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-225" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-225" value="2 (26 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (26 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel3"><br>
         Hansa Rostock - RW Erfurt<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-334"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-334" value="1 (20 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (20 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-334" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-334" value="2 (30 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (30 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel4"><br>
         Unterhaching - SV Wehen Wiesbaden<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-311"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-311" value="1 (27 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (27 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-311" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-311" value="2 (22 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (22 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel5"><br>
         FC St. Pauli - FC Ingolstadt 04<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-661"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-661" value="1 (21 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (21 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-661" value="0 (32 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (32 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-661" value="2 (27 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (27 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel6"><br>
         VfL Bochum - Greuther Fürth<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-82"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-82" value="1 (26 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (26 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-82" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-82" value="2 (23 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (23 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel7"><br>
         1. FC Heidenheim - FSV Frankfurt<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-376"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-376" value="1 (19 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (19 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-376" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-376" value="2 (32 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (32 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel8"><br>
         1. FC Nürnberg - Erzgebirge Aue<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-746"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-746" value="1 (15 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (15 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-746" value="0 (36 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (36 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-746" value="2 (55 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (55 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel9"><br>
         Karlsruher SC - Union Berlin<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-392"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-392" value="1 (21 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (21 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-392" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-392" value="2 (28 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (28 P.)</span></span></span></span>
      </div>




<p></p></div>
<div class="radio-container">
      <label class="label-radio" for="Spiel10"><br>
         SV Darmstadt 98 - SV Sandhausen<br>
      </label><p></p>
<div class="radio-buttons">
         <span class="wpcf7-form-control-wrap radio-180"><span class="wpcf7-form-control wpcf7-radio radio"><span class="wpcf7-list-item first"><input type="radio" name="radio-180" value="1 (19 P.)">&nbsp;<span class="wpcf7-list-item-label">1 (19 P.)</span></span><span class="wpcf7-list-item"><input type="radio" name="radio-180" value="0 (31 P.)">&nbsp;<span class="wpcf7-list-item-label">0 (31 P.)</span></span><span class="wpcf7-list-item last"><input type="radio" name="radio-180" value="2 (32 P.)">&nbsp;<span class="wpcf7-list-item-label">2 (32 P.)</span></span></span></span>
      </div>




<p></p></div>
<p>   <input type="submit" value="Senden" class="wpcf7-form-control wpcf7-submit tipp-send"><img class="ajax-loader" src="http://www.die-tipprunde.com/wp-content/plugins/contact-form-7/images/ajax-loader.gif" alt="Senden ..." style="visibility: hidden;"></p>
</div>

Alles anzeigen

Also die ganzen clearfix entfernen (wirklich alle), den ersten vier p-Tags eine Height von min. 30px geben, die <br> dazwischen löschen. Versuch mal etwas davon umzusetzen.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Contact Form 7 zeigt Formular nicht richtig an

Jetzt mitmachen!