Archived topic
Space before and after embedded vimeo videos
4 replies · Started by Veli-Matti on December 9, 2020
Hi!
I´m changing theme to my website. I have lot´s of embedded Vimeo videos. The problem is that there is lots of space before and after videos. In my old website videos outfit is fine with same CSS-code. I use this kind of codes with videos.
Video goes to left side
<div class="col-md-4 col-xs-12 col-sm-12 video"></div>
Video goes to center
<div class="col-md-4 col-md-offset-4 col-xs-12 col-sm-12"></div>
Video goes to right side
<div class="col-md-4 col-xs-12 col-sm-12 pull-right video"></div>
Could you help me with this issue? I´m creating website for the first time so i need easy way to solve this or specific instructions.
Thanks for your help.
Veli-Matti Tranberg
Here is the codes again. I hope you can see them.
div class="col-md-4 col-xs-12 col-sm-12 video"
div class="col-md-4 col-md-offset-4 col-xs-12 col-sm-12"
div class="col-md-4 col-xs-12 col-sm-12 pull-right video"
Hi there,
Looks like your old theme is using the Bootstrap system which GP doesn't use.
To build the 3 columns layout videos you've shown in the screenshot, try using the Columns block and vimeo embed blocks.
Thanks for your answer. I tryied your tips and it seems to work. I have around 2000 videos so the work is huge. Is there anyway to have boostrap system work?
You'd need to basically implement the Bootstrap system in GP but I would highly recommend against that.
It pretty much defeats the purpose of using a lightweight theme like GP as I explained here:
https://generatepress.com/forums/topic/gp-3-and-bootstrap-css-conflict/#post-1500367