Graham
TECRIDIBLE number 2 in my previous answer
You had not enabled html for the post
Graham
TECRIDIBLE The embed code I used is a little different
<div class="aspect-ratio"><iframe src="http://youtube.com/embed/uf5HbvbPN0o?rel=0" allowfullscreen="allowfullscreen"></iframe></div>
Copy code I tested on my own site and it worked as follows
chrome mine worked yours did not (pc)
win 8 mobile
operamini mine worked yours gave a 'not in an Iframe' warning
ucweb both worked
internet explorer mine worked yours gave a 'not in an Iframe' warning
http://cssw3s.xtgem.com/blog/__xtblog_entry/11350652-test?__xtblog_block_id=1
1 / is the css linked
2 / is html enabled for the post
3 / you could set the size limit in the first class by adding max-width:550px you do not need the width and height in the iframe and the border should be removed by css
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
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
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
Screenshot_20180222-093819.jpg · image/jpeg · 132.61KB