Responsive input fields in CSS - fluid width?

css, forms, input

Solution

Give a `min-width:550px;` to the div containing the text-box and button. Your control will not break then.

Working ex. here http://cssdesk.com/dUjxF

As the definition says min-width sets a min-width to the element, it doesn't go below that size under any circumstances.

Problem

I'm trying to make the following sign up box fluid responsive in CSS. Here is an example: http://cssdesk.com/aYLwW I would like the input field width to be "flexible" and shrink depending on the page. You can see from the example when I shrink the window, the button eventually drops down below the input field. With this in mind, what should I set my input#iiihuu-iiihuu field width to be to allow the input field to gracefully resize without any bumpage? Many thanks for any pointers :-D

Original source

Related problems