Moin :)
Du hast ja das Aussehen für die Kommentar-Funktion bereits definiert. Somit kannst du auch damit arbeiten musst das Ganze nur ein wenig umschreiben.
Das ist dein CSS für dein Kommentar-Formular:
#commentform {
width: 508px;
}
#commentform a {
color: #ffa20f;
}
#commentform input, #commentform textarea {
background: #252525;
border: 1px solid #303030;
color: #ffffff;
padding: 3px;
}
#commentform #commentbox {
height: 100px;
width: 500px;
}
#commentform #submit {
color: #ffffff;
margin-top: 20px;
}
#commentform small {
text-transform: normal;
}
Alles anzeigen
Wenn du möchtest, dass jegliche Formularfelder auf deinen Seiten gleich aussehen sollen, dann kannst du das alles veralgeminert definieren:
/* Da du oben noch eine Suchfunktion hast, würde ich das einzeln definieren und nicht generell für alle form-Tags. Es würde zwar theoretisch überschrieben werden, so sind wir aber auf der sicheren Seite */
#commentform,
.wpcf7-form {
width: 508px;
}
form a {
color: #ffa20f;
}
input,
textarea {
background: #252525;
border: 1px solid #303030;
color: #ffffff;
padding: 3px;
}
textarea {
height: 100px;
width: 500px;
}
/* Absendebuttons */
#submit,
#csubmit {
color: #ffffff;
margin-top: 20px;
}
form small {
text-transform: normal;
}
Alles anzeigen
Dein großer Fehler im CSS war, dass du alles zwar richtig definiert hast, aber für das falsche Objekt:
Nun hast du aber "wpcf7" nicht als ID, sondern wurde als Klasse (class) definiert. Also musst du aus der Raute (#) einen Punkt (.) machen ;)
Und: Submit-Buttons kannst du für alle fast alle Browser so definieren, dass sie genau gleich aussehen! Hintergrundfarbe, Rahmen, Schriftgröße, Breite, Abstände, alles kein Problem, es sieht in allen neueren Browsern dann genau gleich aus!