странный разрыв между полем ввода в Firefox

Question

странный разрыв между полем ввода в Firefox

0

Я пытаюсь сделать кнопку numpad. Вот код скрипки: numpad

если вы откроете это в firefox, вы обнаружите, что есть два вертикальных промежутка (например, между 1 и 2)

Я бы хотел устранить эти два пробела, но понятия не имею, откуда они находятся в Firefox.

как его решить?

Ниже приведен код HTML:

     <div style="width: 755px; margin: 0 auto; ">
    <div class="button-pad">
            <input type="button" value="1" onclick="" />
            <input type="button" value="2" onclick="" />
            <input type="button" value="3" onclick="" />
        </div>
        <div class="button-pad">
            <input type="button" value="4" onclick="" />
            <input type="button" value="5" onclick="" />
            <input type="button" value="6" onclick="" />
        </div>
        <div class="button-pad">
            <input type="button" value="7" onclick="" />
            <input type="button" value="8" onclick="" />
            <input type="button" value="9" onclick="" />
        </div>
        <div class="button-pad">
            <input type="button" value="" />
            <input type="button" value="0" onclick="" />
            <input type="button" value="" onclick="" style="background-image:url(./img/clear.jpg);background-repeat:no-repeat;background-position:center"/>
        </div>
    </div>

Вот мой CSS:

.button-pad > input{
background-color: #EAEAEA;
border: 1px solid #666666;
color: #000000;
font-size: 40px;
font-weight: bold;
padding: 15px;
width: 15%;

}

JavaScripter 20 янв. 2014, в 04:00

Источник

1

Вы можете попробовать добавить float:left и настроить ширину в соответствии с вашими предпочтениями.
luke2012 20 янв. 2014, в 02:13
0

моя сторона выглядит хорошо, не нашел никаких проблем
chen 20 янв. 2014, в 02:27
0

Разве вы не видели два пробела? между колоннами .....
JavaScripter 20 янв. 2014, в 02:33
0

jsfiddle.net/3HbFN/3
luke2012 20 янв. 2014, в 02:37

Показать ещё 2 комментария

Теги:

html

css

html5

1 ответ

Ещё вопросы

Вы можете попробовать добавить float:left и настроить ширину в соответствии с вашими предпочтениями.
моя сторона выглядит хорошо, не нашел никаких проблем
Разве вы не видели два пробела? между колоннами .....

j08691 · Accepted Answer · 2014-01-20T00-33-00.000Z

Встроенные элементы чувствительны к пробелу, поэтому вам нужно избавиться от пространства между вашими входными элементами:

<input type="button" value="1" onclick="" /><input type="button" value="2" onclick="" /><input type="button" value="3" onclick="" />

Кроме того, если вы хотите, чтобы все кнопки были непосредственно смежными друг с другом, измените свой CSS на:

.button-pad > input {
    background-color: #EAEAEA;
    border: 1px solid #666666;
    color: #000000;
    font-size: 40px;
    font-weight: bold;
    padding: 15px;
    width: 15%;
    vertical-align:top;
    margin:0;
}

Пример jsFiddle