埋め込みYouTube動画の両側にある黒いバーを削除します

Question

this webpageにYouTubeビデオを埋め込みました。

再生をクリックすると表示される2本の黒いバーを削除します。だから、

How to remove black bar from the YouTube videos

私は：

こちらをご覧スクリーンショット：

私はスタックオーバーフロー上で検索し、私が見つけた最も近いがこれだったが、それは助けにはなりませんでした次のCSSでビデオを調整しようとしました：

html5-video-container { 
     background-position: center; 
     background-repeat: no-repeat; 
     width: 100%; 
     height: 100%; 
     left: 0px; 
     top: 0px; 
     position: absolute; 
    } 

    video.video-stream.html5-main-video { 
     background-position: center; 
     background-repeat: no-repeat; 
     width: 100%; 
     height: 100%; 
     left: 0px; 
     top: 0px; 
     position: absolute; 
    } 

最初はビデオを調整してみましたが、ビデオコンテナ要素の調整も試みましたが、どちらもうまくいきませんでした。

CSSの専門家が私を助けてくれますか？

動画をクリックして再生する前に表示されるサムネイルと同じサイズにします。

ありがとうございます。

Answer 1

これは、YouTubeのフレームではCSSよりも問題が多いようです。

YouTubeのフレームはページと同じ幅ですが、実際の動画と同じになります。つまり、余分なスペースのがになることを意味します。何かでそれを埋める必要があります！

YouTubeフレームが実際のビデオよりも広い場合、黒いスペースが存在します。 YouTubeフレームの縦横比を実際の動画に合わせる必要があります。