WordPress.org

Ready to get started?Download WordPress

Forums

iframe
[resolved] Style an iframe... (4 posts)

  1. staffanlandin
    Member
    Posted 1 year ago #

    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/

  2. webvitaly
    Member
    Plugin Author

    Posted 1 year ago #

    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.

  3. Hgna
    Member
    Posted 1 year ago #

    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...

  4. webvitaly
    Member
    Plugin Author

    Posted 1 year ago #

    @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;
    }

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.