Я работал и тестировал элемент select. Я хочу выровнять текст по правому краю. В Chrome и Firefox он работает отлично ... однако с дорогим старым IE, похоже, не работает.
Вот мой код:
#inputGroupSelect05 {
width: 100%;
background: rgba(0, 0, 0, 0) url("../img/chevron-bottom-white-2x.png") no-repeat left .75rem center;
text-align: right;
-ms-text-align: right;
text-align-last: right;
-ms-text-align-last: right;
}
select#inputGroupSelect05 {
width: 100%;
text-align: right;
-ms-text-align: right;
text-align-last: right;
-ms-text-align-last: right;
}
select#inputGroupSelect05 > option {
background-color: white;
color: black;
width: 100%;
text-align: right;
-ms-text-align: right;
text-align-last: right;
-ms-text-align-last: right;
}
<div class = "col-sm-6 col-md-3 col-lg-3">
<select class = "custom-select" id = "inputGroupSelect05" style = "color: white;">
<option selected>More Search Options</option>
<option value = "1">One</option>
<option value = "2">Two</option>
<option value = "3">Three</option>
</select>
</div>
Как вы можете видеть в CSS, я также включил префикс -ms-, но проблема все еще сохраняется в IE. Я озадачен этой дилеммой, пожалуйста, помогите.
дорогой старый IE должен покоиться с миром
Вы нашли решение?
Попробуй добавить dir = "rtl"
.
У меня это работает в IE.
Взгляните на этот SO-Post.
select, option {
text-align:right;
}
option {
direction:rtl;
}
<select>
<option>Foo</option>
<option>bar</option>
<option>to the right</option>
</select>
<select dir = "rtl">
<option>Foo</option>
<option>bar</option>
<option>to the right</option>
</select>
Возможный дубликат text-align: справа от <select> или <option>