TECRIDIBLE
Dear Graham,
you gave me this code some days back for my site it worked here next launcher 3d shell but the code is not working on blog
<style>
/* This element defines the size the iframe will take.
In this example we want to have a ratio of 25:14 */
.aspect-ratio {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56%; /* The height of the item will now be 56% of the width. */
}
/* Adjust the iframe so it's rendered in the outer-width and outer-height of it's parent */
.aspect-ratio iframe {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
</style>
Copy code
/* This element defines the size the iframe will take.
In this example we want to have a ratio of 25:14 */
.aspect-ratio {
position: relative;
width: 100%;
height: 0;
padding-bottom: 56%; /* The height of the item will now be 56% of the width. */
}
/* Adjust the iframe so it's rendered in the outer-width and outer-height of it's parent */
.aspect-ratio iframe {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
</style>
Copy code
Youtube Code:
<div class="aspect-ratio"><iframe src="http://m.youtube.com/watch?v=uf5HbvbPN0o" width="550" height="275" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>
Copy code
Copy code
This code not worked blog on blog
1. change height to auto
2. width is too much big change to 100% bro
on chrome the video doesn't show only top is visible
Test Page
TECRIDIBLE
