Why doesn't the <input> element respect min-width?

Question

http://jsbin.com/nuzazefuwi/1/edit?html,css,output

In the link above the textbox should have only 10px instead it has a width of 152px.

This is

Answer 1

There is size="20" set on type text, search, tel, url, email, and password ... by default, which is approximately of 100px width, although it can vary in a different browser and operating system.

On the parent, you have min-width:15px; set, that does not take any effects, because the value is much smaller than 100px. If you change it to width:15px; or max-width:15px; you will then see the differences.

Alternatively you can give the size a very small value such as size="1".