The preview image was done with the main/original theme, not Bootstrap. Because of the way Bootstrap works (and not by my design), form elements are always 100% the width of their container, which was uncomfortably long for any area where all I needed/wanted was 200px - so I set the default length to 200px using css, mostly because I was loading the original copy of Bootstrap from a CDN, for speed reasons, and had no access to change it.
However, did you also see that the quantity field had an id associated with it? Fix it with css:
Code:
#quantity {width: 50px;}
By the way? It was original set with just css, anyway, in style-kyt.css, around line 56:
Code:
@media (min-width: 767px){
input.form-control, select.form-control { width: 200px; display: inline-block;}
}
That's a media query and it says if the browser window/device is at least 767px wide, all text input fields are 200px. Just above this in the file, I have this same field set to 100% width (which is default behavior) because on small screens, that's generally ok.
So, again, just make a line specifically for the quantity field.