Schorn: Button formatieren

Hey,

ich möchte einen Button so formatieren, dass er aussieht wie normaler Text. Dazu mein Ansatz:

  
.butttext {  
  display: inline;  
  margin: 0;  
  padding: 0;  
  width: auto;  
  font-size: 1em;  
  background: transparent;  
  border: none; }  

Klappt im FF und Opera auch - im IE 7 hat der Button aber immer noch große Abstände rechts und links.

Jemand eine Idee, woran das liegen könnte?

Danke an alle!

LG

  1. Hallo,

    ich möchte einen Button so formatieren, dass er aussieht wie normaler Text.

    Das finde ich semantisch als völliger Blödsinn. Für so etwas gibt es Links, etc.

    margin: 0;
      padding: 0;

      
    Was ist denn mit den Einheiten?  
    Du msússt hier angeben, ob du px, em, cm, mm, .. meinst.  
      
      
    MfG. Christoph Ludwig
    
    -- 
    Wo die Sprache aufhört, fängt die Musik an...  
    Selfcode:  sh:( fo:| ch:} rl:( br:> n4:? ie:{ mo:) va:} js:| de:> zu:) fl:( ss:) ls:&  
      
    Go to [this](http://home.arcor.de/minicrispie) 
    
    1. Hi,

      margin: 0;

      padding: 0;

      
      >   
      > Was ist denn mit den Einheiten?  
        
      Null Elefanten, die auf deinem Fuss stehen, tun genauso (wenig) weh, wie Null Spitzmäuse.  
        
      
      > Du msússt hier angeben, ob du px, em, cm, mm, .. meinst.  
        
      Nein.  
        
      MfG ChrisB  
        
      
      -- 
      Light travels faster than sound - that's why most people appear bright until you hear them speak.
      
      1. Mahlzeit ChrisB,

        Du msússt hier angeben, ob du px, em, cm, mm, .. meinst.

        Nein.

        Als Ergänzung: Nein - wenn die <http://de.selfhtml.org/css/formate/wertzuweisung.htm#numerische@title=numerische Angabe> allerdings von 0 abweicht, ist die Angabe einer Maßeinheit zwingend erforderlich.

        MfG,
        EKKi

        --
        sh:( fo:| ch:? rl:( br:> n4:~ ie:% mo:} va:) de:] zu:) fl:{ ss:) ls:& js:|
  2. ich möchte einen Button so formatieren, dass er aussieht wie normaler Text. Dazu mein Ansatz:

    Defintiere "button" - meinst du einen Link (a-Element), ein input-Element z.B. mit dem type "submit" oder gar wirklich ein button-Element?

  3. Hallo Schorn,

    Klappt im FF und Opera auch - im IE 7 hat der Button aber immer noch große Abstände rechts und links.

    Jemand eine Idee, woran das liegen könnte?

    ja, der IE unterhalb der Version 8 macht BUTTON-Elemente immer anderthalb mal so breit wie es die enthaltene Textmenge eigentlich nur erfordert und verteilt je ein Viertel des Platzes, den der Text einnimmt, noch einmal als Padding-Left und -Right. Das fand die Firma Microsoft wohl mal chic.

    Man kann den IE6 und den IE7 aber mit JavaScript z.B. über sog. CSS-Expressions zwingen, Buttons nicht breiter darzustellen als ein direkt hineingeschachteltes Element an Platzbedarf hat. Expressions sind zwar kein valides CSS, haben aber den Vorteil, dass vernünftige Browser sich davon dann auch nicht beeindrucken lassen.

    button { *width:expression(firstChild.offsetWidth + 'px');*height:expression(firstChild.offsetHeight + 2 + 'px'); }

    <button><span><img src="img/struktur/icons/ico_login.gif" width="20" height="20" alt="" />Login</span></button>

    Für den IE8 sind solche Maßnahmen meines Wissensn nicht mehr erforderlich, er würde CSS-Expressions ja auch ohnehin nicht mehr verstehen, es sei denn man würde ihn mit einem META-Tag in den 7er-Modus runterschalten:

    Gruß Gernot

    1. @@Gernot Back:

      nuqneH

      Man kann den IE6 und den IE7 aber mit JavaScript z.B. über sog. CSS-Expressions zwingen, Buttons nicht breiter darzustellen als ein direkt hineingeschachteltes Element an Platzbedarf hat. […]
      Für den IE8 sind solche Maßnahmen meines Wissensn nicht mehr erforderlich

      Für IE < 8 auch nicht.

      Qapla'

      --
      Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
  4. @@Schorn:

    nuqneH

    Klappt im FF und Opera auch - im IE 7 hat der Button aber immer noch große Abstände rechts und links.
    Jemand eine Idee, woran das liegen könnte?

    IE: Leerraum bei Button-Beschriftung

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    1. Hallo Gunnar,

      Klappt im FF und Opera auch - im IE 7 hat der Button aber immer noch große Abstände rechts und links.
      Jemand eine Idee, woran das liegen könnte?
      IE: Leerraum bei Button-Beschriftung

      Darauf, dass width:auto; in Verbindung overflow:visible; (gerade die Kombi ist ja besonders gaga!) bei irgendeinem Element und insbesondere beim BUTTON-Elementen im IE einen Effekt haben könnten, wäre ich im Leben nicht gekommen.

      Danke an dich und an ChrisB!

      Ich sollte hier wohl mal wieder regelmäßiger vorbeischauen!

      Gruß Gernot