Как сверстать input и label грамотно?

Question

[Ivan Ukhov]

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

Answer 1

[Владимир]

Если позволяет браузерная поддержка то на флексах проще всего.
например
<label><span>текст</span><input></label>

label {display:flex;}
span {flex: 0 0 auto;}/*не меняет размеров*/
input {flex: 1 1 auto}/*занимает все оставшееся пространство и сжимается*/

Comments

[Ivan Ukhov]

Спасибо

Answer 2

[Lorem Ipsum]

Bootstrap forms