Frame around youtube video?

by BenQ
3 replies
  • WEB DESIGN
  • |
Anyone ever make a frame around a youtube video? I'm building a site where they want their video highlighted. I'd like to build some kind of antique picture frame around the video. Are there any templates for that? I can't find any.

Any tips on how to do this would be appreciated. Thanks
#frame #video #youtube
  • Profile picture of the author rhinocl
    If you make a div slightly bigger than your embed settings you could give it a background with the picture of the frame. Then let the embedded video cover the center section of the picture. Probably need another div inside the first so you can center the embedded video (margin 0px auto and adjust margins for vertical centering.
    {{ DiscussionBoard.errors[7172804].message }}
  • Profile picture of the author yukon
    Banned
    Maybe not the cleanest CSS but it works.

    Div background image frame source:

    Source files attached at the bottom of this comment.











    HTML Code:
    <!DOCTYPE html>
    <html>
    <head>
    <style type="text/css">
    
    #div-1 {
    background-image:url('./images/1g.jpg');
    background-repeat:no-repeat;
    width: 600px;
    height: 422px;
    }
    
    #div-2 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 420px;
    height: 315px;
    margin-left: 96px;
    margin-top: 88px;
    }
    
    </style>
    </head>
    
    <body>
    
    <div  id="div-1">
    <div  id="div-2"> 
    
    <iframe width="423" height="253" src="http://www.youtube.com/embed/_r-0C9TGkpc" frameborder="0" allowfullscreen></iframe>
    
    </div>
    </div>
    
    </body>
    </html>
    {{ DiscussionBoard.errors[7173022].message }}
  • Profile picture of the author BenQ
    Nice, Yukon, much appreciated.
    {{ DiscussionBoard.errors[7173666].message }}

Trending Topics