вход type=submit текстовое выравнивание по вертикали в Firefox
При реализации древовидных алгоритмов для класса код платформы профессор дал нам, имел древовидный класс как друга класса узла.
Это действительно не приносит пользы кроме позволенного, Вы получаете доступ к членской переменной, не используя функцию установки.
3 ответа
Я нашел этот пост, потому что несколько месяцев назад решил эту проблему, а когда сегодня снова столкнулся с ней, то не смог вспомнить, что натворил. Мило. После того, как я наткнулся на свой css, я наконец-то нашел "исправление". Я не могу отдать должное, потому что нашел его где-то в интернете, но надеюсь, что он будет так же полезен для вас, как и для меня:
input::-moz-focus-inner /*Remove button padding in FF*/
{
border: 0;
padding: 0;
}
Надеюсь, это поможет.
У меня была такая же проблема, и я решил (только для FF и Safari), исправив ширину, но не высоту, и поигрался со значениями: padding (top and bottom), line- height и, если необходимо, установите выравнивание по вертикали по середине. Однако все это проще сделать, если вы установите все значения (даже размер шрифта) в пикселях.
РЕДАКТИРОВАТЬ: Я думаю, что кроссбраузерного решения не существует, потому что проблема связана с отображение текста в браузерах. Чтобы полностью решить проблему, вы можете нарисовать фоновое изображение с текстом и применить это изображение к ссылке или кнопке. Даже если с этим решением вы потеряете доступность.
В качестве альтернативы вы можете использовать условные операторы CSS для улучшения макета для каждого браузера.
I have same problem every time I need to style form buttons. Sorry, quite busy at the moment so only brief description how I usually fix it.
In FF Text is usually a bit lower, exactly like on the image you attached and so then I simply apply "padding-bottom" on the button itself. It moves the text on the button number of pixels up.
The problem is it also moves text in IE and now IE looks a bit off. To fix that I apply "line-height" to the same button with exactly same value as the height of the button. That makes IE to ignore padding completely and positions the text right in the middle. Below is sample HTML code:
<input type="submit" value="SEARCH" class="search"/>
and CSS:
.search
{
background: transparent url(../images/sprites.gif) no-repeat -310px 0; /* some button image */
height: 29px;
width: 104px;
border: 0;
/* centering text on button */
line-height: 29px; /* FF will ignore this but works for IE. This value should be same as value of the height property above */
padding-bottom: 2px; /* IE will ignore but works for FF */
}
Sorry I didn't applied it directly to your code but I'm a bit busy at the moment, hope you got the idea and it helps though.
ps. just checked in IE8 and all above moves text few pixels up. So it means more (endless?) mocking around with padding top/bottom.. I lost my patience now though and I think I'll be putting all this in separate stylesheet from now on that is until I find some fairly easy and universal solution for all this