2014年4月2日 更新日：2016/01/10

スマホでyoutubeの横幅がはみ出る

アメブロで、youtubeの動画を埋め込もうとすると、横幅がレスポンシブに可変してくれない。右に大きくはみ出てしまいます。

対応方法は、youtubeの動画の埋め込みコードの横にサイズ選択のBOXがありますので、そこをカスタムにして、横幅を295pxにすると、うまく、iphoneで表示されます。

iframe{ width:100%; }とcssに追記してもアメブロの場合、適用してくれません。divクラスを指定すれば、PCのままの埋め込みファイルでもスマホでアジャストできるのですが、タグの追記が編集中にめんどくさくなるので、サイズのみ295pxにしてアップすれば、一応PCでもスマホでもOK範囲のような気がします。
というのは、いずれにせよ、気に入った動画を食いついてみるには全画面表示などと、youtubeサイトにリンクしていることがほとんどですから・・・。
紹介程度なら、300px前後でも十分かと思いました。