Eingabefelder Kontaktformular

[Bushisan]

Hallo zusammen,

hatte mein E-Meil Kontaktformular wundaerbar aungepasst - auch die Breiete der Eingabefelder war i.O.

jetzt sind die Eingabefelder schmäler als die Box - kann mir jemand sagen wearum das plötzlich so ist - ich Danke Euch
Hier mal ein Link zu einer Testseite

https://shotokan-karate-dojo-neukirchen ... page18.php

Das Feld für die Datenschutzerklärung (Link und Häkchen) sind auch verschwunden

Schönen Abend noch
Gruß Hubert

[Tommy Herrmann]

Moin,

das musst Du selbst produziert haben. Du hast der Box mit dem Formular mit der id="mybox" einen festen linken Außenabstand von 120px gegeben

#mybox {
margin-left: 120px;
}

... das geht natürlich nicht, das ist ja am Handy bereits fast die halbe Bildschirmbreite.



Das ist doch ein Formular vom Werner - da musst Du eine Checkbox für den Datenschutz schon selbst mit ran schreiben, bzw. im Formular-Generator mit erstellen. Da müsstest Du das schon noch erstellen (ich kann es nicht im Quelltext sehen).


... da ist aber ein anderer Syntax-Fehler im Formular (wahrscheinlich durch unachtsames Kopieren entstanden).

Unter dem E-Mail Feld steht das. Das rot markierte muss da raus und der Tabindex muss '3' sein:

<p>
<label> Betreff:
<span class='pflichtfeld'></span><br>
<input type='text' name='betreff' value='' <input type='email' name='email' value='' class='form-control' tabindex='2'>
</label>
</p>

[Bushisan]

Hallo Tommy - Danke vielmals - die 120 waren ein schreibfehler 20 Stand vorher drin.

Was ich aber am PC meine ist, dass die Eingabefelder die Box nicht ganz ausfüllen.

https://shotokan-karate-dojo-neukirchen.de/page18.php

Muss ich eigentlich zwingend diesen Hinweis auf die Datenschutzerklärung im Mailformular haben oder reicht nicht ein allzeit ersichtlicher Navibutton?

Gruß und Danke
Hubert

[Tommy Herrmann]

Moin,

ich kann das nicht wirklich erkennen - vielleicht guckt ja Werner mal.

Es könnte an der

class="form-control"

liegen, obwohl diese mit der Breite "width: 100%;" richtig angegeben ist, hatte ich da irgendwo 500px für die Breite entdeckt und finde es nicht wieder


Weiterhin solltest Du das auf jeden Fall entfernen:

Code: Alles auswählen

  <meta charset="UTF-8">
  <title></title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- Den Dateipfad zu Bootstrap eventuell anpassen! -->
  <link rel="stylesheet" href="bootstrap.min.css">

... wo hatte ich das angegeben - war das noch in einem uralten NOF-Tutorial ??? Das ist doch in Mobirise schon alles dabei.


Und die Style-Anweisungen für das Formular vom Generator müssten eigentlich auch komplett raus:

Code: Alles auswählen

<style>
  body, textarea {
   font-family: Verdana, Sans-Serif;
   font-size: 1rem;
  }

  span.pflichtfeld {
   font-size: 0.90rem;
   color: black;
  }

  span.hilfetext {
   font-family: Arial, Tahoma, Sans-Serif;
   font-size: 0.80rem;
   font-style: Oblique;
   color: #009500;
  }

  blockquote {
   width: 385px;
  }
  </style> 

[Bushisan]

Ich danke Dir Tommy,

hab die Sachen gelöscht.

Hab alles durchgeschaut - Angaben mit einer Breite von 500px hab ich nirgends gefunden.

Vielleicht kann mir ja Werner weiterhelfen

Vielen Danke nochmal

Grüße aus der Oberpfalz
Hubert

[Tommy Herrmann]

... schreibe mal in den Bereich "CSS Editor" (rechte Seite vom "Code Editor") vom Block mit dem Formular diese Class rein:

Code: Alles auswählen

label {
  display: inline-block;
  margin-bottom: .5rem;
  width: 100%;
}

... das sollte es sein:

[Bushisan]

Funzt


Bist und bleibst der Beste - 1000 Dank

[Tommy Herrmann]

Moin,

prima - wie ich sehe, hast Du das Formular nochmals komplett neu in HTML5 erstellt - sehr gut

[Werner-Zenk.de]

Moin,

@Bushisan
Da hat sich ein kleiner Rechtschreibfehler eingeschlichen,
E-Mail <=> eMail
Laut Wikipedia wird diese als E-Mail bezeichnet

[Bushisan]

Ich danke Euch !!!