Couch Baby

Fluid Width Video For YouTube

by | Nov 14, 2016 | Web Development | 0 comments

My problem… getting an embedded YouTube video to automatically resize according to container sizes.

This is how you would post the embeded video:

<div class="videoWrapper">
    <!-- Copy & Pasted from YouTube -->
    <iframe width="560" height="349" src="http://www.youtube.com/embed/n_dZNLr2cME?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>
</div>

Then add the following custom CSS:

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

Source with more info on other video sources: https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php

Meet Vela Blue!

I’ve never heard William Tell’s Overture and the Super Mario Bros. jam played like this before!

Happy New Year, 2018

Happy New Year everyone! 2018 is here.

Johnny Depp Speed Drawing by Igor Kazarin

Igor Kazarin speed draws Johnny Depp.

Show Me The Money: Have you received your Stimulus Check yet?

The fact that some people received their checks is a good indication for the rest who are anxiously waiting.

If You Eat A Polar Bear’s Liver

Interesting facts that you may not have known.

Chiropractic​ Miracle

Chiropractic changes life for teenager with acute pain and dead leg.

Do I Have Too Many Credit Cards?

A question that has probably been floating around your head while deciding to apply for a new credit card..

Meet SpotMini

The robot dog that can run, hop and open doors.

IT CHAPTER TWO – Official Teaser Trailer

Evil resurfaces in Derry as director Andy Muschietti reunites the Losers Club—young and adult—in a return to where it all began with “It Chapter Two.” – Warner Bros. Pictures

Overwatch Animated Short: “Infiltration”

My sister just told me about this. I love these Animated Shorts from Overwatch! https://youtu.be/Og5-Pm4HNlI