Убрать подсветку submit-а

[Dotod]

Кто-нибудь знает, как отключить подсветку submit-а? В IE и Opera при кликах на полях формы на submit-е появляется дополнительный контур - как бы подсветка. Нужно, чтобы submit никак не менялся. Полагаю, это делается через стили для стандартных submit-ов. Что интересно, button ведет себя "спокойно" пока его не трогают. Но надо отправлять данные, поэтому submit

[Mavrun]

Как вариант - кнопке задать какой-нибудь класс CSS и прописать ему оформление (background, border, font, width, height)

[rus]

Разве что картинкой:

<input type="image" src="image.jpg ">

[Dotod]

Как вариант - кнопке задать какой-нибудь класс CSS и прописать ему оформление (background, border, font, width, height)

Я и так оформил кнопку через стили. Все равно при прогулке по полям формы, вокруг кнопки появляется ореол

Разве что картинкой:

<input type="image" src="image.jpg ">

Да, можно нарисовать кнопку. А что, стандартную никак не настроить?

[Mavrun]

В таком разе не отказался бы от скрина

да, появилась идея поставить через цсс ещё outline: none. но хз, думаю это не совсем то. хотя стоит попробовать

а так дельный вариант предложили - картинкой

[mishka]

покажи стили на кнопку. Ты наверное там оставил бордер. Хочешь чтобы не менялось - убери бордер

[rash]

да, появилась идея поставить через цсс ещё outline: none.

Стоит попробовать. Если это не поможет (для инпутов, кажется, IE все равно рисует аутлайн), тогда придется позвать JS: onfocus="this.blur()" или что-то в этом роде

[Dotod]

Вот стили для кнопки <input name="butsend" id="butsend" value="Отправить" class="butclass" type="submit">:

/* внешний вид для кнопки */

.butclass{

width:75px;

height:20px;

font-family:Verdana, Geneva, sans-serif; font-size:11px;

border-left: 1px solid #CCC;

border-top: 1px solid #CCC;

border-right: 2px solid #666;

border-bottom: 2px solid #666;

margin-top:12px;

}

Если поставить бордер:0, то ореол и правда исчезает, а вместе с ним и вся красота кнопки - остается какая-то опечатка природы. Оутлайн:ноне тоже не помогает. Через js при фокусе полей формы пытался снять фокус с кнопки: onFocus="document.getElementById("butsend").blur()"

И это не помогло. Выходит, только рисовать так, чтобы ореол смотрелся нормально в разных браузерах. Какая маленькая досада. Других идей нет?

[psywalker]

Вот стили для кнопки <input name="butsend" id="butsend" value="Отправить" class="butclass" type="submit">:

/* внешний вид для кнопки */

.butclass{

width:75px;

height:20px;

font-family:Verdana, Geneva, sans-serif; font-size:11px;

border-left: 1px solid #CCC;

border-top: 1px solid #CCC;

border-right: 2px solid #666;

border-bottom: 2px solid #666;

margin-top:12px;

}

Если поставить бордер:0, то ореол и правда исчезает, а вместе с ним и вся красота кнопки - остается какая-то опечатка природы. Оутлайн:ноне тоже не помогает. Через js при фокусе полей формы пытался снять фокус с кнопки: onFocus="document.getElementById("butsend").blur()"

И это не помогло. Выходит, только рисовать так, чтобы ореол смотрелся нормально в разных браузерах. Какая маленькая досада. Других идей нет?

Видимо нет.

[Dotod]

Ап хелп!

[Dotod]

Проблему можно посмотреть на примере этого сайта: http://www.cyberforum.ru/

Если сверху справа покликать по полям "Имя" и "Пароль", то вокруг кнопки "Вход" появляется ореол. Как его убрать, черт побери? Думаю, у них нет смысла спрашивать

Кстати, повторюсь, такая проблема возникает в Opera и IE. Ffox нормально

[Int]

Имхо, это особенности работы браузера.

[cane]

Ап хелп!

поискав описание решения данной проблемы на инглоязычных сайтах, нашел подходящее решение в статье Any way to remove IEs black border around submit button in active forms?.

смысл в том, что для input type="submit" сбрасываем бордер и оборачиваем применяя необходимые стили

/* submit button */
span#submit {
	display: block;
	float: right;
	width: 160px;	  
	margin: 0 10px 5px 2px;
	padding: 0;
	background: #fff url("images/input_gray_bg.png") repeat-x top;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);	
	border: solid 1px #bbb;	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;			
}
span#submit:hover {
  color: #356AA0; /* Digg Blue */
  background: #fff;
  border: solid 1px #85b1de;/* #33677F; */
  -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
}
span#submit input {
	width: 100%;
	border: none;
	background: none;
	margin: 0 auto;
	padding: 3px;
	cursor: pointer;	
	-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;
	-webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;
}

			
<span id="submit">
				<input type="submit" name="submit" tabindex="5" value="Отправить" />
				<input type="hidden" name="comment_post_ID" value="<?php echo $id; ?>" />
</span>