Title: Style an iframe…
Last modified: August 20, 2016

---

# Style an iframe…

 *  Resolved [staffanlandin](https://wordpress.org/support/users/staffanlandin/)
 * (@staffanlandin)
 * [13 years, 6 months ago](https://wordpress.org/support/topic/style-an-iframe/)
 * Never mind, just stupid. Figured it out.
 * _Hey, great plugin. I want to put some style to my iframes, I put this into my
   iframe tag to get some shadow:_
 * style=”margin-top:50px; margin-left:0px; -moz-box-shadow: 2px 2px 6px #000; -
   webkit-box-shadow: 2px 2px 6px #000;”
 * That worked great.
 * Now, since I wanted to add that shadow to all my iframes, I would like to put
   that in a class, is there a default class and where do I find it (not in hte 
   syle.css, right)
 * I tried to put following class in the styles.css:
 * #iframe {
    margin-top:50px; margin-left:0px; -moz-box-shadow: 4px 4px 14px #000;-
   webkit-box-shadow: 4px 4px 14px #000; }
 * But that is not enough. Even when adding class=”iframe” or what ever i call it.
   Apparently I don’t know much about css and classes, where should I put the class-
   tags and how should I do this?
 * [http://wordpress.org/extend/plugins/iframe/](http://wordpress.org/extend/plugins/iframe/)

Viewing 3 replies - 1 through 3 (of 3 total)

 *  Plugin Author [webvitalii](https://wordpress.org/support/users/webvitaly/)
 * (@webvitaly)
 * [13 years, 6 months ago](https://wordpress.org/support/topic/style-an-iframe/#post-3257095)
 * You can just add this style to your main theme style.css file:
 *     ```
       iframe {
       margin-top:50px;
       margin-left:0px;
       -moz-box-shadow: 4px 4px 14px #000;
       -webkit-box-shadow: 4px 4px 14px #000;
       }
       ```
   
 * And all iframes on your site will have box-shadow.
 *  [Hgna](https://wordpress.org/support/users/hgna/)
 * (@hgna)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/style-an-iframe/#post-3257170)
 * Hi. I would like to add padding around my iframes so there is some space between
   the iframe and the text in the post. I used the code above as a model, replacing
   it with padding:
 * Iframe {
    Padding: 10px; }
 * I inserted the code in the beginning of the css style sheet. It didn’t work. 
   What am i dong wrong? Any particular place in the style sheet where i have to
   insert the code?
    I us the suffusion theme…
 *  Plugin Author [webvitalii](https://wordpress.org/support/users/webvitaly/)
 * (@webvitaly)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/style-an-iframe/#post-3257171)
 * [@hgna](https://wordpress.org/support/users/hgna/): IMHO your style will not 
   work because you cannot style the content of iframe because of security reasons.
 * Try this:
 *     ```
       iframe {
       border: 10px solid transparent;
       }
       ```
   
 * Or this:
 *     ```
       iframe {
       margin: 10px;
       }
       ```
   

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Style an iframe…’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/iframe_99a44b.svg)
 * [iframe](https://wordpress.org/plugins/iframe/)
 * [Support Threads](https://wordpress.org/support/plugin/iframe/)
 * [Active Topics](https://wordpress.org/support/plugin/iframe/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/iframe/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/iframe/reviews/)

 * 3 replies
 * 3 participants
 * Last reply from: [webvitalii](https://wordpress.org/support/users/webvitaly/)
 * Last activity: [13 years, 4 months ago](https://wordpress.org/support/topic/style-an-iframe/#post-3257171)
 * Status: resolved