<iframe>タグをHTMLとCSSの中央に配置する

Question

アニメーションを中心に整列しようとしていますが、CSSを使用しようとしましたが、何も動作していないように見えます。彼らはしない。最初Gyazoで

https://gyazo.com/b5b6b9f64e01ccfb107a63470ec5a544

それは中心が、以下の私は、Webページをロードするとき、それは全てを中心とされていないの私のスクリーンショットに見えるリンクします。

https://gyazo.com/f920e6004c39dc19eaadbe5f73abd7ae

それはGyazoリンクでだ、私はJSFiddleリンクをアップロードしようとしましたが、私はすべての4つのインデントなどでコードをアップロードする方法を見つけ出すことができなかったので、私はあなたがすべての必要なと思っていることを申し訳ありません情報。

Answer 1

親のdivは100％の幅で、テキストの中心を合わせる必要があります。子供は高さ/幅について考える必要があります。

// css 
.parent { 
    width: 100%; 
    text-align: center; 
} 

.child { 
    width: 300px; 
    height: 200px; 
} 

// html 
<div class='parent'> 
     <iframe class='child' src="https://www.youtube.com/embed/xLkHEZTSeoU" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe> 
</div>