✔ Formularfeld zum Absenden

S

schmidtt1

Mitglied
Es geht um ein Kontaktformular.
Ich habe es soweit fertig.
Es funktioniert auch alles.
Nur das mir das Feld zum Absenden noch nicht gefällt.
Wie kann ich das Feld zum Absenden so gestalten, dass es wie ein Button aussieht?

PS:HTML 5
 
Was hast du denn für ein Feld zum Absenden? Zeig doch mal deinen Code.

Ein normaler Absende-Button schaut so aus:
HTML: 
<input type="submit" value="Absenden" />
 
Hier der Code
PHP: 
<?php
                                    // wenn das Formular übermittelt wurde
                                    if(isset($_POST['abschicken'])){
                                        while(list($feld,$wert)=each($HTTP_POST_VARS)){
                                        // übermittelte Inhalte "entschärfen"
                                        $wert=preg_replace("/(content-type:|bcc:|cc:|to:|from:)/im", "",$wert);
                                            $$feld=$wert;
                                            // die übermittelten Variablen werden zum "Text der Email" zusammengefasst
                                            if($feld!="abschicken"){
                                        $mailnachricht.=ucfirst($feld).": $wert\n";
                                                }
                                                }
                                        $mailnachricht.="\nDatum/Zeit: ". date("d.m.Y H:i:s");
                                        // Überprüfen ob alle Pflichtfelder gefüllt sind
                                        empty($name) ? $err[] = "<p>- Bitte den Namen angeben.</p>" : false;
                                        empty($email) ? $err[] = "<p>- Bitte die Email-Adresse angeben.</p>" : false;
                                        empty($text) ? $err[] = "<p>- Welchen Wunsch haben Sie? Bitte den Text eingeben.</p>" : false;
                                        // wenn nicht, werden die Fehlermeldungen ausgegeben und das "halbgefüllte" Formular angezeigt
                                        if(!empty($err)) {
                                            echo "<p>Bitte korrigieren Sie folgende/n Fehler:</p>";
                                            foreach($err as $fehler){
                                                echo $fehler;
                                            } ?>
                                    <form id="form-main" action="#" method="post" enctype="multipart/form-data">
                                        <fieldset>
                                        	<div class="wrapper">
                                            	<div class="column-1">
                                                	<label>
                                                    	Name:<br>
                                                        <input name="name" value="<?php echo $name; ?>" type="text">
                                                    </label>
                                                    <label>
                                                    	*E-mail:<br>
                                                        <input name="email" value="<?php echo $email; ?>" type="text">
                                                    </label>
                                                    <label>
                                                    	Telefon:<br>
                                                        <input name="telefon" value="<?php echo $telefon; ?>" type="text">
                                                    </label>
                                                </div>
                                                <div class="column-2">
                                                	*Nachricht:<br>
                                                    <textarea name="text"><?php echo $text; ?></textarea>
                                                </div>
                                            </div>
                                        </fieldset>
                                        <input type="reset" class="button" value="Formular l&ouml;schen" style="width:49%" />&nbsp;&nbsp;<input type="submit" name="abschicken" class="button" value="Formular absenden" style="width:49%" />
                                    </form>
                                    <p>*Pflichtfelder</p>
                                    <?php    // sind keine Fehler vorhanden, wird die Email versendet
                                    } else {
                                    $mailbetreff="Kontaktformular ".$_SERVER['HTTP_HOST'];
                                    // HIER DIE EMPFÄNGER EMAIL-ADRESSE ANPASSEN******
                                    if(mail("tobiasschmidt@anoxo.de", $mailbetreff, $mailnachricht, "From: $email")){
                                        echo "<p>Vielen Dank f&uuml;r Ihre eMail!</p>";
                                    } else {
                                        echo "<p>Ein Fehler ist aufgetreten!</p>";
                                    }
                                    }
                                    // das Formular welches als erstes dem Besucher angezeigt wird
                                    } else { ?>
                                    <form id="form-main" action="#" method="post" enctype="multipart/form-data">
                                        <fieldset>
                                        	<div class="wrapper">
                                            	<div class="column-1">
                                                	<label>
                                                    	*Name:<br>
                                                        <input name="name" value="" type="text">
                                                    </label>
                                                    <label>
                                                    	*E-mail:<br>
                                                        <input name="email" value="" type="text">
                                                    </label>
                                                    <label>
                                                    	Telefon:<br>
                                                        <input name="telefon" value="" type="text">
                                                    </label>
                                                </div>
                                                <div class="column-2">
                                                	*Nachricht:<br>
                                                    <textarea name="text"></textarea>
                                                </div>
                                            </div>
                                        </fieldset>
                                    <input type="reset" class="button" value="Formular l&ouml;schen" style="width:49%" />&nbsp;&nbsp;<input type="submit" name="abschicken" class="button" value="Formular absenden" style="width:49%" />
                                    </form>
                                    <p>*Pflichtfelder</p>
                                    <?php
                                    }
                                    ?>
 
Zuletzt bearbeitet von einem Moderator:
Sorry, aber wo genau ist jetzt dein Problem?
Welches Feld meinst du genau?

Und bitte poste doch deinen Code in den HTML-Tags: [code=html]Your code...[/code]
 
Auf der Seite http://www.anoxo.de/kontakt.html
sieht man, dass das Absenden-Feld genauso aussehen, wie die anderen.
Wie kann ich erreichen, dass diesem Feld eine Button-Klasse zugewiesen wird?
HTML: 
<input type="reset" class="button" value="Formular l&ouml;schen" style="width:49%" />&nbsp;&nbsp;<input type="submit" name="abschicken" class="button" value="Formular absenden" style="width:49%" />
Ausserhalb von <form> zeigt er mit die als buttons an, so wie ich es haben möchte.
Aber ich muss es ja innerhalb <form> haben und da wird es "falsch" angezeigt.
 
schmidtt1 hat gesagt.:
... Wie kann ich erreichen, dass diesem Feld eine Button-Klasse zugewiesen wird?
Zum Vergrößern anklicken....
Dieses Inputfeld hat ein Klassenattribut mit dem Namen "button" und dadurch wird eine Formatierung vorgenommen. Aber vermutlich ist sie nicht wirksam, da sie sich gegen die höhere Spezifität der Regel mit dem ID-Selektor "#form-main input" nicht durchsetzen kann.

Erweitere den Klassenselektor ".button" zu "#form-main input.button" in der Datei "style.css".
 
Zuletzt bearbeitet:
So, das habe ich jetzt in style.css hinzugefügt
Code: 
#form-main input .button {display:inline-block; font-size:10px; color:#fff; padding:5px 9px 6px; text-transform:uppercase; background:#000;}
#form-main input .button:hover {background:#ff5400;}
Es wird aber leider immer noch nicht korrekt angezeigt.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück