Hi,
I have added the footer for each device separate eg. desktop mobile and tablet but on the tablet/iPad 2 could you have a look at this screenshot and check the URL here.
How to fix the video showing in the 4th col?
Thanks
Hi,
I have added the footer for each device separate eg. desktop mobile and tablet but on the tablet/iPad 2 could you have a look at this screenshot and check the URL here.
How to fix the video showing in the 4th col?
Thanks
Hello There,
Thanks for writing in! To resolve your issue, please add the following CSS code in the X > Launch > Theme Options > Global CSS (http://prntscr.com/evui3r)
body .x-bar-content-area iframe{
width: 100%;
max-width: 100%;
}
Please let us know if this works out for you.
Hi,
I have added that worked but still doesn’t look good. Now black border is showing up can you take another look at this, please?
Thanks
Hello There,
The video before is displaying the the exact iframe dimension and it created an issue in smaller screens because it goes beyond the container size. Adding the css code will make sure that the video will only display within the bounds of the container. The drawback is that black bar because the video height is relative to the width. This is how embed video works. A black bar will display to make sure that the video plays at a ratio.
You may remove the css code I gave you and make use of the this iframe code instead:
<iframe width="100%" height="100%" src="https://www.youtube.com/embed/HCxjM6GFTY8?rel=0&controls=0&showinfo=0&wmode=transparent" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen="" wmode="Opaque"></iframe>
You will get the same result because the video dimensions are relative to each other.
Hope this make sense.
This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.