input type = «image» показывает нежелательную границу в Chrome и неработающую ссылку в IE7

У меня нет нашел решение пока нет ...

Я пробовал все

border:0;
border:none;
outline:none;

безуспешно ... и самое забавное - это значок неработающей ссылки в IE7, который перекрывает мое изображение.

Есть предложения? ссылка здесь

HTML (сгенерировано WordPress)

<form id="searchform" method="get" action="http://eezzyweb.com/">
   <div>
  <input id="s" name="s" type="text" value="" size="32" tabindex="1"/>
  <input id="searchsubmit" name="searchsubmit" type="image" value="" tabindex="2"/>
   </div>
</form>

CSS

input#s{
position:relative;
width:245px;
height:28px;
border:0;
vertical-align:bottom;
background:url(images/input-search-bkg.png) 0 0 no-repeat;
}

#searchsubmit {
display:inline-block;
background:url(images/submit-bkg.png) 0 0 no-repeat;
width:30px;
height:30px;
border:0;
vertical-align:bottom;
}

Firefox и Opera отображают кнопку изображения нормально, но в Chrome и Safari я получаю серый граница вокруг него. IE 7 и 8 добавляют символ (сломанный значок?) Поверх моего изображения ... Я сбит с толку.

14
задан Mirko 5 November 2010 в 21:25
поделиться