1

My apologies if this has been asked in a different way elsewhere.

I have a web app that features a form users can embed on their websites via iframe. I am trying to make the content of the iframe responsive. I am familiar with how to edit content using media queries, but I am at a lost for how to use media queries that respond to the iframe's parent window. Is this possible?

Also - yes, I am aware of the Same Origin Policy, and no, I won't have access to end users' websites (to add javascript to the parent frame).

EDIT Media queries using max-device-width and min-device-width on the iframe'd content work, which I for sometime reason had overlooked. They were an easy fix.

user3732292
  • 11
  • 3
  • possible duplicate of [How to access parent Iframe from javascript](http://stackoverflow.com/questions/935127/how-to-access-parent-iframe-from-javascript) – Etheryte Jun 12 '14 at 02:51
  • Have you tried setting the iframes width to 100%? If the content inside the frame is fluid (or responsive), will flex with the iframe as it changes size, just like it is a browser window. I assume of course you are trying to add it to already responsive sites. – laymanje Jun 12 '14 at 02:55
  • @Nit it's not a repeat, only because the frame is on a different domain (whereas in that question you quoted, they are the same domain). I have actually already solved the issue, I was overthinking it and assuming that media queries in the iframe wouldn't detect min/max-device-width. However, they do, so you can use media queries with those parameters just like on a normal html document. – user3732292 Jun 12 '14 at 03:04

0 Answers0