Add this to the container page.

.vimeo-wrapper {
	padding: 0;
	margin: 0;
}

Select allOpen in new window

Padding and margin on the vimeo Iframe is fine - it is the vimeo-wrapper that is the problem

I tried what you suggested but it didn't work.  As I mentioned, I suspect that it might be being caused by some CSS that's contained within the embedded iframe.

- yg

Has something to do with the height setting a 100%.

If I run Chrome + Inspect + then for the body tag, disable height == 100%, white space collapses.

The problem is not in the iFrame. it is caused by this line

.embed-responsive-4by3 {
	padding-bottom: 75%; /*<== Change to 50%*/
}

Select allOpen in new window

Hmm .. changing the CSS for that element isn't going to work, as it's resulting in the media control bar getting hidden when I reduce the padding percentage to 50%.  I'm now wondering if I might need to ditch the current bootstrap approach for responsive embedded vimeo videos and to instead try to achieve it using some other approach.  

The challenge seems to be with maintaining the proper height / aspect ratio for the video when resizing the browser.  Any suggestions?

- Yvan

Thanks Julian!  that did the trick.

You are welcome.