[CSS] -webkit-appearance: none; für FireFox und IE

Dieses Thema im Forum "Webdesign" wurde erstellt von GaYlORd, 18. April 2012 .

Schlagworte:
  1. 18. April 2012
    -webkit-appearance: none; für FireFox und IE

    Hi,

    ich habe ein Auswahlfeld (select) und möchte das selbst gestalten.
    In Chrome und Safari funktioniert das:

    Code:
    .select_stlye select{
     background-image:url(../images/select_y.png);
     background-color: #000;
     width: 96px;
     height: 33px;
     font-size: 11pt;
     -webkit-appearance: none;
     padding: 3px;
     color: #fff;
     border: 0px;
    }
    
    .select_stlye{
     overflow: hidden;
     width: 96px;
     height: 33px;
     color:#fff;
     display: inline-block;
    }
    
    select_y.png wird angezeigt, wie gewünscht.

    Bei Firefox und IE geht das leider nicht.

    Gibt es da eine Alternative?

    Danke!

    Gruß
    gl
     
  2. 19. April 2012
    AW: -webkit-appearance: none; für FireFox und IE

    appearance is kein css-standard und wirds vermutlich auch nicht werden.

    wenn du dein select-element selbst gestalten willst, musst du wohl auf javascript zurückgreifen und dir was eigenes basteln.

    FYI: sowas ist schlechte praxis und beeinträchtigt die benutzbarkeit.

    deine benutzer kennen das aussehen der verschiedenen elemente von ihrem betriebssystem und deren programmen und finden diese dann nicht mehr auf deiner webseite.

    ein element mit nem pfeil nach unten ist ja schön und gut, aber ein bekanntes select-element ist einfach schneller identifiziert und jeder weiß was man damit machen soll.

    aber bei diesem thema scheiden sich die geister. ich persönlich finde standard form-elemente besser und übersichtlicher.
     
  3. 19. April 2012
    AW: -webkit-appearance: none; für FireFox und IE

    Da gebe ich dir recht!
    Allerdings wird das eine Seite für eine Art "Edel-Club". Und die wollen das so. Passt auch in das Design rein. Da steht nur kurz nen Infotext und Input-Forms für Name, Email. Und das Geburtsdatum wollen die halt mit 3 Dropdowns haben...

    Ok, muss mal schauen, ob ich den Umweg über JS geh oder ob dies auch so nehmen^^

    Danke
     
  4. Video Script

    Videos zum Themenbereich

    * gefundene Videos auf YouTube, anhand der Überschrift.