Menu icon Foundation
Another Vertical Center and iFrame Question

I have found several posts about this, but not a suitable answer to my particular situation.  I have two sites that have a row of text on one side and a Vimeo video on the other.  I have tried two different methods, but I am not happy with the results of either.  I am hoping for some ideas.

Just a little way down on the page you will see it.  It looks fine for larger screens, but both of them look bad between 1024 & about 1400px wide.

http://www.rockymountainhondadealers.com/one-tank-trips 

 

http://www.westernwashingtonhondadealers.com/one-tank-trips

 

Any suggestions on how to put that video frame in the middle of that vertical space in the columns would be great. You can see the second link almost works but i can't constrain the video player to the correct ratio.

iframevideo playervimeovertical position

I have found several posts about this, but not a suitable answer to my particular situation.  I have two sites that have a row of text on one side and a Vimeo video on the other.  I have tried two different methods, but I am not happy with the results of either.  I am hoping for some ideas.

Just a little way down on the page you will see it.  It looks fine for larger screens, but both of them look bad between 1024 & about 1400px wide.

http://www.rockymountainhondadealers.com/one-tank-trips 

 

http://www.westernwashingtonhondadealers.com/one-tank-trips

 

Any suggestions on how to put that video frame in the middle of that vertical space in the columns would be great. You can see the second link almost works but i can't constrain the video player to the correct ratio.

Rafi Benkual over 2 years ago

 Hi Michael - 

The first link doesnt work. The second one does. 

I think you want to put your video inside the responsive embed which will help keep it's proportions http://foundation.zurb.com/sites/docs/responsive-embed.html

Michael Barthel over 2 years ago

Looks like that might just be the answer.  Thanks, Rafi!

Michael Barthel over 2 years ago

Dang!  That wasn't it.  The CMS that this site is built on has a very early version of Foundation 6.  I do not think they plan to update to 6.3 or 6.4 any time soon.  I am already using the flex-video class on both sites. Both videos do maintain the proper aspect ratio, but the player controls go outside of the video on the second site.  I am using the data-equalizer component for the row in order to center the video. (I fixed the first link, btw).  The first site just lets it rest at the top of the vertical space.  Neither solution is ideal.

 

First link

Second Link