title: How to I edit a style inside an iframe using React?
body: <p>I need to render an iframe inside a react component but want to hide an element inside it. The iframe's domain is external though.</p>
  <p>Is there any way I can inject in custom CSS in the <code>iframe</code> and do what I need?</p>
  <p>Here is my component:</p>
  <pre class="lang-js prettyprint-override"><code>import React from 'react'
  
  const ExampleComponent = () =&gt; {
    return ( &lt;&gt;
      &lt;iframe src=&quot;https://app.sli.do/event/6ouwoyzr&quot;&gt;&lt;/iframe&gt;
    &lt;/&gt; );
  }
   
  export default ExampleComponent;
  </code></pre>
  <p>And the css I want to inject:</p>
  <pre class="lang-css prettyprint-override"><code>app-header {
      display: none;
  }
  </code></pre>