Form's Hierarchy Changes at Different Browser Sizes

I just realized that my form's structure changes and breaks at different browser sizes. Here is an example - https://gyazo.com/941cb0fb038916d6c544b1aed565b8e1

As you can see, at different sizes the heirarchy of labels and input boxes shift and change. Please advise how I can keep the structure the same (at largest browser size) regardless of browser size.

s

Inject this CSS codes to your form. This should fix it.

.form-label.form-label-auto {display: block !important; float: none !important; } [data-type="control_textbox"] .form-textbox, [data-type="control_fullname"] .form-textbox, [data-type="control_email"] .form-textbox, [data-type="control_textarea"] .form-textarea, [data-type="control_dropdown"] .form-dropdown {width : 100% !important; max-width: none !important; } [data-type="control_dropdown"] .form-input, [data-type="control_birthdate"] .form-input, [data-type="control_time"] .form-input, [data-type="control_dropdown"] .form-input-wide, [data-type="control_birthdate"] .form-input-wide, [data-type="control_time"] .form-input-wide, [data-type="control_textbox"] .form-input, [data-type="control_textarea"] .form-input, [data-type="control_fullname"] .form-input, [data-type="control_phone"] .form-input, [data-type="control_datetime"] .form-input, [data-type="control_address"] .form-input, [data-type="control_email"] .form-input, [data-type="control_passwordbox"] .form-input, [data-type="control_autocomp"] .form-input, [data-type="control_textbox"] .form-input-wide, [data-type="control_textarea"] .form-input-wide, [data-type="control_fullname"] .form-input-wide, [data-type="control_phone"] .form-input-wide, [data-type="control_datetime"] .form-input-wide, [data-type="control_address"] .form-input-wide, [data-type="control_email"] .form-input-wide, [data-type="control_passwordbox"] .form-input-wide, [data-type="control_autocomp"] .form-input-wide {width: 100%; max-width: 100%; } .form-textbox, .form-textarea, .form-dropdown {max-width: none !important; box-shadow : none; outline : none; box-sizing : border-box; -webkit-box-sizing : border-box; -moz-box-sizing : border-box; font-family: inherit; } .jotform-form .form-all {margin: 0 auto; width: 100%; max-width: 590px; } .form-line, .form-line.form-line-column {padding: 12px 36px;}

Guide: http://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

Result: