How can I resolve this so when we post YouTube videos using HTML, it doesn't stretch the entire page out on mobile?

Setting the video's width to 100% solves the issue, but then on Desktop version the video is absolutely huge.

Please see attached (screenshot on mobile)

 

Bump

The way around I found for this problem on version 3.4, was to edit the media tags for youtube and youtube.be

I went to Look & Feel > Post Content > Manage Media Tags > YouTube (and/or YouTube.be)

and from

<iframe id="ytplayer" class="EmbeddedVideo" type="text/html" width="640" height="390" src="http://youtube.com/embed/$3?html5=1&fs=1" frameborder="0" allowfullscreen webkitallowfullscreen /></iframe>

I deleted the width and height values, it remained like this:

<iframe id="ytplayer" class="EmbeddedVideo" type="text/html" src="http://youtube.com/embed/$3?html5=1&fs=1" frameborder="0" allowfullscreen webkitallowfullscreen /></iframe>

Then I recached the skins, and that seems to have fixed it. It looks fine using an iPhone 6 Plus (which is what I use). I tested it on an old iPhone 3GS and the video just goes out a bit off the page, but it is a very small screen and not many people are likely to use smartphones that old by now.

I don't know if this will produce some undesired side effects, but so far I haven't noticed anything that looks bad.

Actually the above made the videos on the desktop version too small. I had to compromise with this:

<iframe id="ytplayer" class="EmbeddedVideo" type="text/html" width="380" height="232" src="http://youtube.com/embed/$3?html5=1&fs=1" frameborder="0" allowfullscreen webkitallowfullscreen /></iframe>