Buy Now
Sign in

Responsive multi field form

ocsavsaid , June 08 at 21:44
Hi. ​
​I have a tabbed form. In one tab I have two dynamic dropdown lists, two simple dropdowns, a radio box , a text box and a submit button. It's loading a price from database according to the selections. The form inputs are all inside a multi field and all elements display inline on big screens. ​
​All the logic is working as expected however the responsiveness of the form is not great. I tried all the styles and none seam to be completely responsive. I would like all the fields to be 100% wide on mobile devices but the media queries only seem to affect the button. Nothing else. Even with the !important; rule.​
​I have tried I'd selector, class selector and nothing seams to override de bootstrap3. ​
​.gbs3 .chronoform .gcore-input{width:100% !important;}​
​.gbs3 .chronoform .form-control{width:100% !important;}​
​With the above code some of the fields do what's expected but only if the labels are on the left of the inputs. Is they are on the top as I want them, nothing happens.​
​Am I doing something wrong? Should I approach it in a different way? ​
​Any help would be much appreciated. Thanks in advance. Vasco​