Seite 1 von 1

Hintergrundfarbe beim "INPUT TYPE=IMAGE"

Verfasst: 21.09.2007 14:40
von Rote Socke
Ahoi,
irgendwie hab ich seit drei Tagen eine Blockade.
Probier schon alles mögliche.

Ich habe ein Formular, welches auch so aussieht, wie es soll.
Nun möchte ich aber nicht ein normales Submit-Feld haben, sondern dem Style angepasst ein Button.
Das Button ist aber nicht rechtwinklig sondern oval. (PNG-Format mit eben in den Ecken transparente Bereiche).
Mein Problem ist nun, dass die transparenten Bereiche des Buttons mit der Hintergrundfarbe der normalen Input-Felder angezeigt wird.
Sieht nicht sehr schön aus.

Kann mir jemand helfen?

Vorschau unter Testformular

Dort findet ihr auch den Code aus dem Template sowie den dazugehörigen CSS-Abschnitt.

Danke im Vorraus,
bernd

Verfasst: 21.09.2007 14:54
von punkface
Mit dem CSS Code

Code: Alles auswählen

input {
	border-width: 0;
	background-color: transparent;
}
sollte es wie von dir gewünscht angezeigt werden. Allerdings betrifft das auch alle anderen Input-Elemente wie etwa Eingeabefelder, die sich wiederrum ohne Rand und Hintergrundfarbe schwer ausmachen lassen - sprich: In der Form ungeeignet.

Du könntest zwar mit dem Selektor

Code: Alles auswählen

input[type="image"]
nur Input-Elemente vom Type image ansprechen, damit kommt allerdings der IE nicht zurecht (welch ein Wunder).

Der einfachste Weg wäre also, den Input-Elementen vom Type image eine eigene CSS-Klasse zu geben, und dieser CSS-Klasse die oben genannten Eigenschaften zu zuweisen.

edit:/ Außerdem solltest du den Input Elementen noch einen alternativ Text (alt) zuweisen. Nur für den Fall das Bilder vom Browser nicht geladen oder angezeigt werden können.

Verfasst: 21.09.2007 18:23
von Rote Socke
Danke!
Habe nun einfach ein Style-Attribut innerhalb des Input-Tags gesetzt:
style="border-width: 0; background-color: transparent;"

Damit funktioniert es nun.