Как заставить контейнер правильно отображать горизонтальную полосу прокрутки, распознавая отступы справа? ⇐ Html

[Anonymous]

У меня есть следующий макет:


JSFiddle: https://jsfiddle.net/v72use8z/
Заполнение справа на #container работает до тех пор, пока не достигнет #текстовое поле. Горизонтальная полоса прокрутки не отображается, только когда окно становится слишком узким для текстового поля. Как мне это сделать?

Код: Выделить всё

#container {
height: 200px;
padding-right: 20px;
overflow-x: auto;
background-color: blue;
}

#form {
background-color: red;
}

#input {
width: 300px;
}

Код: Выделить всё

Input:




Option 1
Option 2

x

Подробнее здесь: https://stackoverflow.com/questions/798 ... zing-paddi