We have a page the embeds a Google Calendar in an iframe. Recently, a warning box div began appearing on the calendar that looks like this:
<div id="warningBox" style="color:#aa0000;">Events from one or more calendars could not be shown here because you do not have the permission to view them.</div>
We don’t want this box to show on the page. Obviously the best solution here is to find the private events and remove them, but so far the search for those events has proved fruitless. This calendar is an aggregate of several calendars, including a few we don’t control (ie weather). We’re still looking, but in the meantime I would like to try to hide that div (especially if the private events prove to be on a calendar we can’t change).
I know that iframes enforce the separation between the pages, such that the child page is pretty much a law unto itself. But surely there must be some way to set a style on an element inside the frame?
Unfortunately, there isn’t. As long as the iframe is on a different domain, you cannot access it’s content. You would have no problems if the iframe belonged to the same domain as the parent page.