やあみんな、これを解決する方法がわからないという奇妙な状況。
メディアクエリを使用してレスポンシブ Web サイトにアクセスしようとしています。埋め込まれた YouTube 動画もレイアウトに対応する必要があるため、各動画の with を 100% に設定し、その高さを比率で計算しようとしています!
結果は次のようになります。
<p class="youtube-vid">
<object width="100%" height="61%">
<param name="movie" value="http://www.youtube.com/v/rBa5qp9sUOY?version=3">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<embed src="http://www.youtube.com/v/rBa5qp9sUOY?version=3" type="application/x-shockwave-flash" width="100%" height="61%" allowscriptaccess="always" allowfullscreen="true">
</object>
</p>
したがって、もともとこのビデオは、YouTube から埋め込んだときに 500px x 306px でした。
問題は、これが実際に機能する可能性があることですが、パーセンテージがどこを指しているのかわかりません。幅 100% は完全に正しく、私のレイアウトに依存している場合、高さ 61% は正しくありません。61% は正しい数値ですが、おそらく外部コンテナーまたは何かの 61% であるため、間違っているように見えます。
この問題を解決する方法を教えてください。ビデオの元の値に応じて、ビデオを100％（現在は正しいです-サイズ変更しても）、比例した高さにしたいだけですか？