Ich habe versucht, den Text in der <select> Element auf der rechten oder der Mitte in Safari ausrichten. Aber nichts hat funktioniert. text-align:center; funktionierte in allen Browsern außer Safari. direction:rtl; und dir="rtl" haben nichts getan. Die Liste wird in Safari immer nach links ausgerichtet. -webkit-appearance: none; hilft auch nicht. Bitte ich brauche eine Lösung.Text-Align funktioniert nicht auf Safari <select>
Für Safari
text-align: -webkit-center;
jedoch der beste Weg, um die Bearbeitung von HTML/CSS zu analysieren ist die Web-Inspektor in Safari.
Wie gesagt ich in meinem Kommentar oben Ich weiß das nicht eigentlich eine CSS-Lösung ist, aber wenn es Ihnen wichtig ist funktioniert dies als eine Arbeit um, wenn Sie verwenden jquery bereit sind. ... es in Chrom funktioniert nicht richtig, aber wenn Sie für den Browser überprüfen können Sie es nur für Safari laden:
das ist für mich gearbeitet.
select {
text-align:-moz-center;
text-align:-webkit-center;
}
es funktioniert nicht auf alten Versionen. Sie verwenden wahrscheinlich eine neue Version. Bitte lesen Sie das Fragedatum, bevor Sie es beantworten. – shnisaka
Funktioniert nicht. bitte antworte nicht ohne zu testen. –
@SunnyKhatri Er sagt klar, dass es für ihn funktioniert hat, also hat er es getestet. Es hat wahrscheinlich 2013 funktioniert –
Wenn Sie keine Lösung gefunden haben, können Sie diesen Trick auf AngularJS verwenden oder js Verwendung mit einem Text auf dem div ausgewählten Wert abzubilden, ist diese Lösung vollständig CSS-konform auf Winkel sondern muß eine Zuordnung zwischen wählen und div:
var myApp = angular.module('myApp', []);
myApp.controller('selectCtrl', ['$scope',
function($scope) {
$scope.value = '';
}]);.ghostSelect {
opacity: 0.1;
/* Should be 0 to avoid the select visibility but not visibility:hidden*/
display: block;
width: 200px;
position: absolute;
}
.select {
border: 1px solid black;
height: 20px;
width: 200px;
text-align: center;
border-radius: 5px;
display: block;
}<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example - example-guide-concepts-1-production</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-app ng-controller="selectCtrl">
<div class=select>
<select ng-model="value" class="ghostSelect">
<option value="Option 1">Option 1</option>
<option value="Option 2">Option 2</option>
<option value="Option 3">Option 3</option>
</select>
<div>{{value}}
</div>
</div>
</div>
</body>Hope this für jemanden nützlich sein könnte, wie es mir einen Tag nahm diese Lösung auf phonegap zu finden.
Ist ein Bug in Safari.
Bug 40216 - text-align funktioniert nicht auf select-Tags
https://bugs.webkit.org/show_bug.cgi?id=40216
2010 Filed
Sie es auf der "Option" Tag statt wählen Sie versucht haben, einstellen? – Trey
ja. Es gibt das gleiche Ergebnis – shnisaka
Ich habe damit gespielt und sehe mich um, ich kann keine CSS-Lösung finden ... hier ist etwas mit jquery, das fast funktioniert http://jsfiddle.net/nEGV4/ – Trey