Button-Beschriftung linksbündig / Firefox

[Jost aus Soest]

Wie bekomme ich Firefox und co. dazu, eine Button-Beschriftung linksbündig anzuzeigen? Bisher habe ich es so versucht (mit IE keine Probleme):

<style>
#nav a {
  display:block;
  width:20em;
  //...
}
#nav .linkButton {
  display:block;
  width:20em;
  text-align:left;
  //...
}
</style>

<div id="nav">
<input type="submit" value="Beschriftung" class="linkButton">
</div>

Zum Hintergrund: Der Button soll letztendlich wie die anderen Menü-Links aussehen.

[Gernot Back]

Hallo Jost,

Wie bekomme ich Firefox und co. dazu, eine Button-Beschriftung linksbündig anzuzeigen?

  
#nav .linkButton {  
  display:block;  
  width:20em;  
  max-width:20em;  
  text-align:left;  
  padding-right:100%;  
}  

So unorthodox funktioniert es jedenfalls bei mir im Mozilla 1.7.2 und schadet dabei auch Opera 7.54 und dem IE6 nicht.

Gruß Gernot

[Jost aus Soest]

Hallo Gernot,

vielen Dank, das klappt wunderprächtig!  :-))
Auf "padding-right:100%" wäre ich im Leben nicht gekommen...

Ich war bisher nur auf folgende "Lösung" gekommen:

--- schnipp ---
#nav .linkButton {
  display:block;
  width:20em;
}
#nav .linkButton div {
  text-align:left;
}
--- schnupp ---
<button type="submit" class="linkButton"><div>bla</div></button>
--- schnapp ---

Nun ja, "schön" ist etwas anderes...  ;-D

Vielen Dank und viele Grüße
Jost aus Soest ("jooost aus sooost")