iFramed narrow form using mobile style

[Chris_Vanderma1]

Hello,

I am trying to iFrame a form into our Website in a narrow piece of body content. The width of the body is 470px, thus I am iFraming the form at 470px. Using firebug I can see that at 480px and narrower the /js/forms2/css/forms2.css stylesheet (not user editable as far as I can tell) is called in and implements a mobile style which sets field widths to 100% and places labels above their fields. This totally breaks my style and just doesn't look good on my iframed page. Obviously the iframe doesn't allow the landing page to inherit the screen width and the landing page treats the iframe width as the screen width.

Has anyone encountered this and found a solution?

[Anonymous]

You'll need to override the Marketo stylesheet. Here's some primer to get you started: http://stackoverflow.com/questions/11425230/override-css-media-queries

If you have more questions, you can go to my profile and reach out via LinkedIn.

[Chris_Vanderma1]

Thanks for the Suggestion, Jason.

So if I understand correctly I would need to find every element that is changing when responsive and add it to my stylesheet, with the full-width code applied wiht !important tags applied? It seems like a lot of work to go this route. It would have been nice if I could just disable the Marketo stylesheet.