Safari

时间:2017-09-14 03:42:00

标签: html css safari cross-browser option

我正在尝试设置<option>个标签。它在Chrome和Firefox中运行良好,但我也需要在Safari上使用它。您可以看到Chrome中的第一张图片和Safari中的第二张图片。任何帮助,我将不胜感激。

铬:

Chrome view

Safari浏览器: Safari view

.wrap select {
    margin-bottom: 0;
    width: 100%;
    min-height: 400px;
}
.wrap select option {
    background-color: #F9F9F9;
    margin-bottom: 2px;
    padding: 12px 15px;
}

.wrap select option:checked,
.wrap select option:focus,
.wrap select option:active
 {
    background-color: #f8981d;
    background: -webkit-gradient(linear, left top, left bottom, from(#f8981d), to(#f8981d));
    background: -webkit-linear-gradient(#f8981d, #f8981d);
    background: -o-linear-gradient(#f8981d, #f8981d);
    background: linear-gradient(#f8981d, #f8981d);
    font-weight: 600;

}
.wrap select option:hover {
    background-color: #aab3c3;
    color: #f9f9f9;
}
<div class="wrap span5">
	<label>Teams</label>
		<select class='list filterSelect' data-target='select-family' id='select-city' multiple="multiple">
			<option value='1' data-reference='1'>Team 1</option>
			<option value='2' data-reference='2'>Team 2</option>
			<option value='3' data-reference='3'>Team 3</option>
			<option value='4' data-reference='4'>Team 4</option>
</select>
</div>

0 个答案:

没有答案