Странная рамка вокруг input[type=submit] в Opera
12 августа 2010
Opera, в отличие от IE, не так часто «радует» странностями, но иногда, как и у остальных браузеров, случается.
Тестовый наборчик (воспроизводится на последнем релизе, Windows)
При фокусе на input[type=text] вокруг submit появляется чёрная однопиксельная рамка. Так как для кнопки использован border-radius, а рамка у нас прямоугольная, логично предположить, что это не border. Также проверил, что это не outline.
Вадим Макеев подтвердил, что это такая фича, означающая, что форма в данный момент находится в фокусе, а кнопка с чёрной рамочкой её сабмитит. Работает это таким образом только на Windows. Ну и так как такое поведение желательно не всегда, в будущих версиях рамочка либо будет убрана совсем, либо будет документирована и её будет возможно убрать.
Пока же единственный способ решить данную проблему — обернуть кнопку дополнительным элементом, задать самой кнопке border: none, а обёртке соответствующий border и border-radius.
Комментарии RSS по email OK
Интересно, еще опера не поддерживает border-radius на ячейках таблицы и других элементах с display: table-cell
Еще года 2 не чинят баг, когда при наведении из js делаешь cursor: hand (или любой другой) он не меняется пока не отведешь мышку с элемента...
А баг-репорт отправлен?
по поводу курсора точно были и это довольно известный баг, а по поводу скруглений - не знаю, я не писал...
Рамка есть и в FreeBSD
White Shadow
Может они не знают? Стоит написать.
В последней "Опере" (по крайней мере под Линуксом) ещё и чекбоксы испахабили и вообще элементы форм. Например, select стал ужасно некультяпистым. Всё это стилями можно исправить, конечно, но я в последнее время рассчитываю на умолчальные стили браузеров (они тоже рекомендуются w3c), чаще всего всё ОК... но вот "Опера" отличилась. Кстати, я как раз примерно месяц назад отказался от "Оперы", хотя это был мой основной браузер на протяжении многих лет. Всё хуже и хуже она становится.
А если submit заменить на button, проблема остается?
В меньшей степени да. В любом случае submit — это не button.
неплоха бы ещё дать возможность отключать подсвечивание полей, имена которых использовались при запоминании логина/пароля, а то временами оно очень не к месту
В Опере еще и size на input кардинально отличается (input намного длиннее) чем в IE или Firefox
Начал сегодня работать над формой авторизации на своем сайте и столкнулся с точно такой же проблемой, но пока ее не обошел (
В общем я тут тоже столкнулся с этой проблемой))) Выходит, что создатели браузеров не могут пока договориться о том как отображать кнопки... Мне стало интересно как вообще с этим бордюром борется сама Опера на своем сайте, в общем у них там все куда смешнее - они просто выключили это и все, да и вообще кнопка у них кнопка во всех положениях не проявляет никаких действий. Это я о форме авторизации, а в форме регистрации используют вместо input - button, ну для "батона" конечно все круто получается просто можно обойтись стилями css.
А вообще считаю, что конечному пользователю не особо важно как эта кнопка выглядит - главное чтоб функцию свою непосредственную выполняла. Конечно стилизация должна быть, но если не получается настроить этот бордюр то проще вообще от него отказаться - сделать кнопку как на сайте Оперы к примеру - просто и сердито, те кто ее делали не долго парились над решением проблемы)))))
И еще, сайт Оперы к примеру мне не очень нравится, все же коряво сделан - ну это я придираюсь потому что я бы что то сделал более стилизовано и красиво, а вот основной массе пользователь эти улучшения особо не нужны - ведь им важна основная функциональность и простота, а не супер пупер стильные кнопки...
Благодарю! Очень помогло!
Аналогичная ситуация в браузере Opera всё ещё присутствует. И хотя это не критично, но всё таки, думаю, в будущем будет исправлено.