Фоновая проблема в текстовом поле Safari - PullRequest
Новая
       12

Фоновая проблема в текстовом поле Safari

0 голосов
/ 20 апреля 2011

У меня есть текстовое поле, и вместо того, чтобы показывать обычный 1px окаймленный макет, я пытаюсь применить собственное изогнутое изображение в качестве фона для этого ..

По некоторым причинам фон не применяется правильно на настольном Safari, а также на iPad Mobile Safari. Он хорошо работает в IE / FF. Ниже приведен код; 

<div class="inputBox"><input type="text" name="text1"></div>

#rightContent  .inputBox{
background:transparent url(/images/dp/search_screen/keyback.gif) no-repeat scroll center 6px;
border:0pt none;
float:left;
height:40px;
#height:37px;
margin-left:10px;
width:450px;
overflow: hidden;
}

#rightContent  .inputBox input{
padding:12px 8px 5px 12px; 
width:446px;
margin: 0px;
border: 0px none;
background:transparent none no-repeat scroll center;
display: block;
/*outline: none;*/
height: 40px;
#height:37px;
#width: 430px;
#position: relative;
#left: 2px;
#padding:11px 0px 8px;
}

Ниже приведен скриншот

IE / FF: enter image description here

Safari: enter image description here

1 Ответ

0 голосов
/ 20 апреля 2011

Удалите «прозрачный» с вашего фона, который содержит изображение.

Если это не сработает, похоже, что-то еще контролирует текстовые поля Safari. Используете ли вы сброс CSS?

EDIT /

Включить меню разработчика в Safari. Щелкните правой кнопкой мыши по текстовому полю и выберите «Проверить элемент». Посмотрите, откуда эта граница.

Или, чтобы выбрать более быстрый маршрут, объявите !important в конце всех ваших селекторов.

...