Wrap a DIV with style around an integrated YouTube video

I've embedded three YouTube videos onto a page, but I've wrapped them with a DIV and a CLASS called "videoplayer", but the DIV and the CLASS seem to be ignored because they don't display in the page.

You can see it here: http://72.4.166.89/en/tutorial.asp

Here's the CSS being used:

.videoplayer {
border: 1px solid #1D740C;
height: 384px;
width: 480px;
padding: 0px;
margin-left: 25px;
margin-bottom: 25px;

}

I've looked with most of my tools and I don't see the DIV or the CLASS having been used at all, but they are there. Has anyone else run into this, or is this not allowed?

Instead of creating the div to surround the player and adding a class to the div, why not just use the built in class of the player youtube-player to apply your styling:

.youtube-player{
    border: 1px solid #1D740C;
    height: 390px;
    width: 480px;
    padding: 0px;
    margin-left: 25px;
    margin-bottom: 25px;
}

Working example on jsfiddle: http://jsfiddle.net/Damien_at_SF/guSAC/1/

This by-passes the need to have a parent div and also the problem that you have above :)

hope that helps :)

Related Articles