• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Problem mit Grafik innerhalb <button> und DOCTYPE

mikdoe

mikdoe

Moderator
Guten Morgen!

Habe hier ein <button> mit einem Icon dessen Layout mir nicht gefällt und ich bekomme es nicht gepeilt.

Code:
HTML: 
<html>
<head>
  <title>Button Problem</title>
  </head>
  <body>
<button style="cursor: pointer; border: 0px; width: 16px; height: 16px;" type="button"><img src="/images/diskette.png" width="16" height="16" border="0" title="Speichern"></button>
  </body>
</html>

IE8:
Bei <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> sieht es super aus, siehe Bild button_richtig.png
button_richtig.png

Bei <!DOCTYPE html> was ich aufgrund mehrerer Abhängigkeiten favorisiere sieht es besch.... aus, siehe button_falsch.png
button_falsch.png

Firefox 3.6.12:
Sehen bei beiden Doctypes besch.... aus, siehe Bild button_ff.png
button_ff.png

Opera 11.01:
Sehen ebenfalls bei beiden Doctypes besch.... aus, siehe Bild button_opera.png
button_opera.png

Es ist immer dieser graue Hintergrund, der mich stört. Das Diskettensymbol sieht aus wie verrutscht.

Wie schaffe ich es, dass es in allen Browser mit dem <!DOCTYPE html> so aussieht wie auf button_richtig.png?

Danke für jede Hilfe.

Und hier noch das Original Image zum Probieren:diskette.png
 
Zuletzt bearbeitet:
Warum mußt du unbedingt ein <button> benutzen. Es gibt noch andere HTML-Elemente, die man das Aussehen eines Buttons geben kann. Zumal der button im IE so seine Tücken hat.
 
@Junkee: DANKE!! Klappt!
Nachtrag: Leider ändert sich im Firefox garnichts. Der ist mir jetzt aber auch mal egal. Der Rand ist nur ganz fein, damit kann ich leben.


@JSpit: Der muss rechts neben einer Textarea per Tab angesprungen und per Enter ausgelöst werden können. In der Anwendung ist noch ein onclick im <button>. Geht das auch anders?
 
Zuletzt bearbeitet:
Onclick im Button ist ok. Folgendes funktioniert im IE z.B. nicht :
Code: 
<a href="xyz.php" ><button>Anzeige</button></a>

Geht es auch anders? Denke ja, mit : <a href="javascript:... sollte es auch gehen, mit entsprechender CSS-Gestaltung.
 
Zuletzt bearbeitet:
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben