Как правильно задать ширину блоков?

Question

[iNeedHelp]

codepen.io/anon/pen/rLqbAq

В блоке есть два элемента: поле ввода и кнопка. У первого width: 92%, у второго -width: 8%. Но почему-то они не умещаются на одной линии. В чём проблема?

P.S. Все паддинги и маргины сброшены. Ширина родительского блока равна 100%. На все элементы установлено box-sizing: border-box

Comments

[Максим Тимофеев]

Маштаб в браузере сбросьте ctrl+0

Answer 1

[HamSter]

так

footer input {
  display: block;
  float: left;
}

у Вас инпуты inline-block из-за этого появляется отступ в 5px между блоками.

Comments

[iNeedHelp]

добавил inline. При уменьшении экрана почему-то кнопка наезжает на поле ввода

Answer 2

[Олег]

Удалите отступ между инпутами в html или укажите 0 размер шрифта для родителя (footer) или используйте float.