Facebook iframe is not affected by css

Question

      <footer class="mastfoot">
        <div class="inner">
          <iframe class="iframe" src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fmyfacebookpage%3F&amp;width&amp;layout=button_count&amp;action=like&amp;show_faces=true&amp;share=true&amp;height=21&amp;appId=705841689490152" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px;" allowTransparency="true"></iframe>
        </div>
      </footer>

I have this iframe, he is a facebook like facebook page button.. i want setup display none in my css, but doesn't work, the css doesn't effect the iframe..

  .iframe {
    display: none;
  }

what could be the problem?

possible duplicate of [How to apply CSS to iframe?](http://stackoverflow.com/questions/217776/how-to-apply-css-to-iframe) — Shawn Erquhart, Oct 24 '14 at 02:41

score 0 · Answer 1 · answered Oct 24 '14 at 05:43

It´s not about applying CSS to an iframe, because you just want to apply the CSS to the iframe tag itself, right? Give it an ID and try again, always worked for me:

<iframe id="myIframe" src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fmyfacebookpage%3F&amp;width&amp;layout=button_count&amp;action=like&amp;show_faces=true&amp;share=true&amp;height=21&amp;appId=705841689490152" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:21px;" allowTransparency="true"></iframe>

CSS:

#iframe {
    display: none;
}

Facebook iframe is not affected by css

1 Answers1