Как заставить input занять оставшееся пространство в flex-контейнере, а не выходить за его пределы?

Question

[Александр]

Вот вообще не понимаю что делаю не так, с обычным div всё в порядке, а input выходит за границы flex-контейнера и всегда 173px в ширину...
https://jsfiddle.net/7ve8unxg/24/

Answer 1

[Павел]

Так а если:
.select-input {width:100%;}

Comments

[Александр]

Хм, думал, что должно быть достаточно flex: 1

[Павел]

LordGuard, flex к инпуту ни как не относится

[Александр]

Павел, ?? Кстати таки нужно и flex: 1 и width: 100%, так как после того как после input я добавил ещё иконку - input без flex: 1 (но с width: 100%) вытеснил эту иконку за границы flex-контейнера. Когда добавил ещё и flex: 1 - всё пришло в норму.

Answer 2

[Andrej Sharapov]

&-input {
flex: 1;
width:100%;
}