Manchmal kann man stundenlang grübeln und kommt nicht weiter. Danach einfach mal drüber schlafen, wenn es wichtig ist, beschäftigt sich das Gehirn damit in der Nacht - und siehe da, es findet eine Lösung
Bisher wusste ich zwar, dass man Absende-Buttons per HTML als Image einbinden kann, selbiges wollte aber natürlich nicht für Abbrechen- und Durchsuchen-Buttons funktionieren -> aber jetzt hab ich eine Lösung (keine Ahnung, wahrscheinlich bin ich nicht der erste mit dieser Lösung, aber egal):
Hier die benötigten CSS-Definitionen:
Code:
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 90%;
}
.absenden {
background-color: transparent;
background-image: url(absenden.gif);
background-position: center;
background-repeat: no-repeat;
width: 80px;
height: 20px;
font-size: 0px; /* damit nn7 keine ersatzschrift anzeigt */
border: 0px solid white;
}
.abbrechen {
background-color: transparent;
background-image: url(abbrechen.gif);
background-position: center;
background-repeat: no-repeat;
width: 80px;
height: 20px;
font-size: 0px; /* nn7 */
border: 0px solid white;
}
Und hier der XHTML-Code (sollte auch in html 4.01 klappen):
Code:
<!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>
<title>Buttons</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="form.css" rel="stylesheet" type="text/css" />
</head>
<body>
<form name="form1" id="form1" method="post" action="">
<p>
<input type="text" name="textfield" />
</p>
<p>
<input name="Submit" type="submit" class="absenden" value=" " />
<input name="Submit2" type="reset" class="abbrechen" value=" " />
</p>
</form>
</body>
</html>
Wichtig dabei ist es, die Values der Buttons mit einem maskierten Leerzeichen zu versehen, da Netscape 7 ansonsten eine "Ersatzbeschriftung" anzeigt!
Live-Beispiel, getestet auf Win: IE 6, NN 7, Op 7, Moz/Fb 0.7
Standardmäßig zeigen die Browser den Default-Cursor (Pfeil) an. Nachdem die CSS-Definition cursor: hand; nicht spezifiziert und somit nicht valide ist, kann man sich hier - wenn man das will - mit einem grafischen Cursor (*.ico) helfen
hi 
