14 Replies Latest reply on Sep 11, 2017 12:51 PM by DJ Monzyk

    Changing a form's responsiveness through CSS


      I'm relatively new to Marketo and am working with our marketing manager to embed forms within our website. I'm having some difficulty getting the form to be responsive within our responsive pages. Here's an example where I have a simple two-column form that is fine until the page resizes below 720px until it hits 480px.

      Our website is built on Bootstrap 2.3.2 and has a built-in responsive grid and media queries, etc. So while I can see that you have the ability to add CSS to change the style (color, stroke, padding, etc.) of the existing form elements within the layout, I cannot see how I can affect the form's layout responsiveness. It seems to me that I would need the ability to add CSS classes to each of the form elements in order to apply responsive media querie styles, but I don't seem to have the ability to get at the HTML or ed an ID to each element, i.e. First Name Label and Field, Last name Label and Field. or wrap a responsive div around each. 

      Alternately, could I just apply width styles to the elements to mimic what Bootstrap does? So I could treat "mktoFormRow" as if it were a "row-fluid" and the "mktoFormCol" as if they were column or "span" and create media queries for each? 

      Thanks for any help or docs you can point me to!