Home CSS How To Build YouTube IFRAME Videos flexive to view Mobile and Web Browser Friendly

How To Build YouTube IFRAME Videos flexive to view Mobile and Web Browser Friendly

Its achievable with the help of following custom css styles and please add the below pieces of code in your html page:

CSS STYLES:
<style>
* Youtube Flexive for Mobile and web browser */
.video-container {
position: relative;
padding-bottom: 50%;
padding-top: 35px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>

HTML:
<div class=’video-container’>
<iframe width=”600″ height=”450″ src=”http://www.youtube.com/embed/(YOUTUBE_EMBED_CODE_HERE)” frameborder=”0″></iframe>
</div>

You may also like

Leave a Comment