Задать вопрос
@ilyaalekseev
изучаю web

Как отобразить option в select-e горизонтально для Safari (работает в chrome)?

Данный код полностью работает для всех браузеров, кроме Safari. Идея в том, чтобы вывести options в select-e горизонтально с отступами между друг другом.
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important; - не помогают
Как исправить это для safari?
Спасибо.

select {
		-webkit-appearance: none !important;
		-moz-appearance: none !important;
		appearance: none !important;

		display: table-row !important;
		margin: 0 auto !important;
		font-size: 24px !important;
		overflow: hidden !important;
		border: none;
		user-select: none;
		/* supported by Chrome and Opera */
		-webkit-user-select: none;
		/* Safari */
		-khtml-user-select: none;
		/* Konqueror HTML */
		-moz-user-select: none;
		/* Firefox */
		-ms-user-select: none;
	}


	select:focus {
		border: none;
		outline: none;
	}

	select option:focus {
		border: none;
		outline: none;
	}

	option {
		-webkit-appearance: none !important;
		-moz-appearance: none !important;
		appearance: none !important;
		padding: 100px 100px 10px 100px;
		display: inline-block !important;
		background: #fff url('http://via.placeholder.com/350x150') no-repeat center bottom 40px;
		background-position-y: -40px;
		background-clip: border-box;
		background-size: cover;

	}


<select size="4">
			<option value="volvo">Volvo</option>
			<option value="saab">Saab</option>
			<option value="mercedes">Mercedes</option>
			<option value="audi">Audi</option>
		</select>
  • Вопрос задан
  • 299 просмотров
Подписаться 2 Простой 5 комментариев
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы