title: How to change div elements' css inside iframe
body: <p>I've found here in SO these two ways to manipulate css style od div elements inside an iframe:</p>
  
  <pre><code>jQuery("iframe").contents().find(".rc-anchor-normal-footer").css("margin-left", "-60px");
  </code></pre>
  
  <p>and</p>
  
  <pre><code>jQuery("iframe").load(function() {
      var doc = this.contentDocument || this.contentWindow.document;
      var ancor_footer = document.getElementsByClassName("rc-anchor-normal-footer");
      ancor_footer[0].style.marginLeft = "-60px";
  });
  </code></pre>
  
  <p>They both were put inside the <code>jQuery(document).ready(function(){})</code> but none of them works. If i try to give those commands inside firebug JS console I get</p>
  
  <blockquote>
    <p>jquery.js?ver=1.12.4:2 Uncaught DOMException: Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "<a href="http://www.pasticceriaimpero.com" rel="nofollow">http://www.pasticceriaimpero.com</a>" from accessing a cross-origin frame.</p>
  </blockquote>
  
  <p>even if I had set </p>
  
  <pre><code>document.domain = "www.pasticceriaimpero.it"
  </code></pre>
  
  <p>Wham am I supposed to do to make it work?</p>
  
  <p><strong>UPDATE</strong>
  I managed to manipulate <code>g-recaptcha</code> style with the following:</p>
  
  <pre><code>@media not screen and (max-aspect-ratio: 3/4) {
  .g-recaptcha {
    margin-top: 2px !important;
    transform:scale(0.78);
    transform-origin:0 0;
  }
  </code></pre>
  
  <p>and witout accessing every single sub div of the recaptcha with jQuery...</p>