web-dev-qa-db-de.com

Wie wende ich CSS auf eine Mac Chrome-Auswahlbox an?

Egal was ich mache, mit Mac OSX 10.9.2 und Chrome Version 33.0.1750.152, padding, background-color, funktioniert nichts. Ich möchte eigentlich nur einen padding-top und einen padding-bottom von 5px auf ein select-Element anwenden, funktioniert überall auf einer MAC OSX-Konsole. Was gibt? Wie mache ich das global auf allen Plattformen?

23
Solomon Closson

Sie müssen -webkit-appearance:none; anwenden, wenn Sie CSS-Elemente hinzufügen, um Elemente in Webkit-Browsern auszuwählen.

DEMO http://jsfiddle.net/XxkSC/3830/

47
Kevin Lynch

Es gibt eine bessere Möglichkeit, ein natürliches Design zu erzielen:

height:30px;
background:#ffffff;

DEMO JSFiddle

ps

Die Antwort von Vector ist, die Pfeile auf der rechten Seite zu verstecken. 

7
Almog_0

Fügen Sie Ihrer Auswahl in Ihrer CSS-Datei die folgende Eigenschaft hinzu:

-webkit-appearance:none;
2
pconnor88

Wenn Sie bootstrap verwenden, können Sie die Klasse custom-select hinzufügen:

<select class="form-control custom-select">

Nach dem Hinzufügen können Sie schließlich die Höhe anpassen, indem Sie die Eigenschaft line-height zu css hinzufügen:

select {
    line-height: 1.3;
}

https://getbootstrap.com/docs/4.1/components/input-group/#custom-select

0