Antworten auf deine Fragen:
Neues Thema erstellen

Kontaktformular macht kleine Probleme ...

mint

Nicht mehr ganz neu hier

Hallo,

habe ein Kontaktformular nach einem Tut von PSD-Tutorials gebaut und habe das Problem, dass im Firefox im "Nachrichtenfeld" die Schrift viel kleiner ist !? In Opera und Safari gehts, wobei ich im Safari als Umrandung bei den aktiven Feldern einen blauen Glow habe (anstatt eine orange Umrandung). Im IE ist die Schriftart anders und auch der Textbeginn ist komischerweise 1-2 Leerzeichen weiter rechts...

Kann mir jemand helfen ? Bin erst am Anfang mit CSS usw. und für jeden Tipp
dankbar :)




Gruß,Mint
 
Zuletzt bearbeitet:

sokie

Mod | Web

AW: Kontaktformular macht kleine Probleme ...

dass im Firefox im "Nachrichtenfeld" die Schrift viel kleiner ist !?
ist nicht kleiner, wirkt nur so, weil es eine nadere Schriftart ist.
die Eigenschaften die du bei unterschidlichen Browsern bemängelst, sind im css nicht klar formuliert. hol das mal nach, dann wird es gleich viel Einheitlicher.
zB
Code:
form input, form textarea{
  width:265px;
  float:left;
  margin-bottom:10px;
  padding:0px;
  border:1px solid #666;
  font-family: inherit; /*löst das Problem der unterschiedlichen Schrift in der textarea */
}

valides html ist voraussetzung für eine richtige Darstellung -> http://validator.w3.org/
 
Zuletzt bearbeitet:

mint

Nicht mehr ganz neu hier

@sokie

Probier ich aus, Danke.

Gruß, Mint

@sokie.

Jetzt funktioniert auf einmal meine Validation im Formular nicht mehr, wo liegt jetzt da der Fehler ?

Kannst du helfen ?

Gruß, Mint
 
Zuletzt bearbeitet von einem Moderator:

cebito

undefined

AW: Kontaktformular macht kleine Probleme ...

@sokie.

Jetzt funktioniert auf einmal meine Validation im Formular nicht mehr, wo liegt jetzt da der Fehler ?

Kannst du helfen ?

Gruß, Mint
Was genau ist das Problem? Da nur css-Sachen geändert wurden, sollte dein Dokument doch weiterhin valide sein, sofern du rot mal ergänzt...
Code:
 <div id="header"[COLOR=Red][B]>

[/B][COLOR=Black]</div>[/COLOR][/COLOR]
oder meinst du, das die jquery.validate.js nicht mehr greift?
 

mint

Nicht mehr ganz neu hier

AW: Kontaktformular macht kleine Probleme ...

Ja, ich meinte die jquery.validate.js. Da hatte ich in der Tat nichts geändert...

Im Bereich des Header ist noch ein Slider geplant...

Danke & Gruß, Mint
 

Rozz_By

Noch nicht viel geschrieben

AW: Kontaktformular macht kleine Probleme ...

Hallo,

ich habe nach dem gleichen Tutorial wie mint mir ein Kontaktformular erstellt.
Es funktioniert auch größtenteils nur habe ich noch ein paar kleine Probleme.
Ich habe schon viel ausprobiert aber bekomme es irgendwie nicht gelöst.

Zum einen wenn ich mein Kontaktformular ausfülle und auf abschicken klicke, kommt die Fehlerseite der formmail.php mit folgendem Inhalt:

"An error occurred while processing the form .
The form required some values that you did not seem to provide.
Vorname
Nachname
Ihre E-Mail-Adresse"


Ich habe dann die derive_fields mit den Namen angepasst aber es funktioniert trotzdem nicht.

Die Validation funktioniert eigentlich außer das die Fehlermeldung nicht bei allen Pflichfeldern sofort angezeigt wird bei keiner Eingabe und Abschicken sondern erst wenn ich dann dort reinklicke woran kann das liegen? Außerdem habe ich das Problem dass die Fehlermeldung wenn man in dem Feld PLZ ein Buchstaben eingibt direkt neben diesem Feld steht, allerdings folgt danach noch das Feld Ort und das verschiebt sich dann alles, ist es nicht möglich diese Fehlermeldung rechts ausgerichtet zu lassen wie die restlichen Fehlermeldungen?

Hier mal mein PHP Code:
PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Kontaktformular</title>
<link rel="stylesheet" type="text/css" href="CSS/kontaktformular.css" />
</head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.validate.js"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
    $("#kontaktformular").validate();
});

//-->
</script>
<body>
<?php
if($_GET['good'] == 'yes'){
    echo('<p>Vielen Dank für Ihre Nachricht. Wir werden uns umgehend bei Ihnen melden.</p>');
}
?>
    <form action="formmail.php" method="post" name"kontaktformular" id="kontaktformular">
        <input type="hidden" name="env_report" value="REMOTE_HOST,REMOTE_ADDR,HTTP_USER_AGENT,AUTH_TYPE,REMOTE_USER" />
        <input type="hidden" name="recipients" value="..........a3D6Th9O0................de" />
        <input type="hidden" name="required" value="vorname:Vorname,nachname:Nachname,telefon:Ihre Telefonnummer,email:Ihre E-Mail-Adresse,nachricht:Ihre Nachricht an uns" />
        <input type="hidden" name="derive_fields" value="email=email,realname=nachname" />
        <input type="hidden" name="subject" value="Kontaktformular Kunstschmiede" />
        <input type="hidden" name="good_url" value="kontaktformular.php?good=yes" />
        
        <fieldset>
             
            <label for="anrede">Anrede:</label><select name="anrede" class="auswahl" >
                                                  <option value="herr">Herr</option>
                                                  <option value="frau">Frau</option>
                                           </select><br />
            <label for="vorname">Vorname:*</label><input type="text" name"vorname" id="vorname" class="required" /><br />
            <label for="nachname">Nachname:*</label><input type="text" name"nachname" id="nachname" class="required" /><br />
            <label for="straße">Straße / Haus-Nr.:</label><input type="text" name"straße" id="straße" class="breite3" /><input type="text" name"hausnummer" id="hausnummer" class="number breite1" /><br />
            <label for="plz">PLZ / Ort:</label><input type="text" name"plz" id="plz" class="number breite2" /><input type="text" name"ort" id="ort" class="breite3" /><br />
            <label for="telefon">Telefon-Nr.:*</label><input type="text" name"telefon" id="telefon" class="required number" /><br />
            <label for="email">e-Mail-Adresse:*</label><input type="text" name"email" id="email" class="required email" /><br />     
            <label for="betreff">Betreff:</label><input type="text" name="betreff" id="betreff" /><br />
            <label for="nachricht">Nachricht:*</label><textarea name="nachricht" id="nachricht" cols="20" rows="10" class="required" ></textarea><br />
            <input type="submit"  value="Abschicken" name="senden" id="senden" class="button"/><br />
            <input type="reset"  value="Zurücksetzen" name="reset" id="reset" class="button"/><br />
            <p>Mit * gekennzeichnete Felder müssen ausgefüllt werden.</p>
        </fieldset>
</form>
</body>
</html>
und der CSS Code:

Code:
@charset "utf-8";
/* CSS Document */

* { padding:0; margin:0; }

body { padding:40px; font:"Trebuchet MS", Arial, Helvetica, sans-serif; color:#3e3e3e; }
form { width:630px; }
form fieldset { padding:20px; margin-bottom:20px; border:0; }
form label { width:120px; float:left; margin-bottom:10px; }
form label.error { margin-left:5px; color:#F00; }
form input, form textarea { width:250px; float:left; margin-bottom:10px; border:1px solid #999; padding:2px; font-family:inherit; }
form input:focus[type=text], form textarea:focus { border: 1px solid #f60; }
form input.error { border:1px solid #F00; }
form .auswahl { width:60px; float:left; margin-bottom:10px; border:1px solid #999; padding:2px; }
form br { clear:both; }
form .button { margin-left:120px; width:256px; background:#CCC; color:#3e3e3e; cursor:pointer; }
form .button:hover { background:#f60; color:#fff; border:1px solid #f60; }
form .breite1 { margin-left:10px; width:50px; }
form .breite2 { width:50px; }
form .breite3 { width:184px; margin-left:10px; }
Ich habe außerdem auch noch das Problem mit der unterschiedlichen Schriftart im Textfeld und den Inputfelder, durch die Lösung wie oben beschrieben ändert sich nichts irgendwie.

Das Kontaktformular kann auch angeschaut werden auf folgender Adresse:
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.565
Beiträge
1.538.066
Mitglieder
67.488
Neuestes Mitglied
Andrew56524
Oben