Embedded Videos Resizing Using only CSS

vrijvlinder

Embedded Videos and other embedded content Resizing Using only CSS

You can virtually do anything with CSS. If you have people embedding video content or movies that create players and have a set size or the user added his own size, not to worry you can make the content any size you wish and even decorate it with an image border as the example below shows how.

This will make all of the embedded videos become the same size no matter how they were embedded . And add an image border around the video. Note that one browser does not support the image border afaik . You can guess which it is

.Preview .Message, .MessageList .Message .Video object embed {
clear: both;
line-height: 140%;
font-size: 100%;
word-wrap: break-word;
border: 15px solid transparent;
width: 480px;
padding: 5px 10px;
-moz-border-image: url(http://www.wpclipart.com/page_frames/more_frames/more_frames_3/generic_border.png) 20 20 20 20;
-webkit-border-image: url(http://www.wpclipart.com/page_frames/more_frames/more_frames_3/generic_border.png) 20 20 20 20;
-o-border-image: url(http://www.wpclipart.com/page_frames/more_frames/more_frames_3/generic_border.png) 20 20 20 20;
border-image: url(http://www.wpclipart.com/page_frames/more_frames/more_frames_3/generic_border.png) 20 20 20 20;
}

System_Error

Like