<iframe> 태그를 HTML 및 CSS 가운데에 맞 춥니 다.

Question

애니메이션을 가운데로 맞추려고합니다. CSS를 사용해 보았지만 아무것도 작동하지 않는 것으로 보입니다. 변경 사항이 있는지 보려면 여백과 여백을 조정 해 보았습니다. 그들은하지 않습니다. 첫 번째 Gyazo에서

https://gyazo.com/b5b6b9f64e01ccfb107a63470ec5a544

은 모든 중심하지 않는, 내가 웹 페이지를로드 할 때 중심하지만 아래의 내 스크린 샷에 보이는 연결합니다. 이 Gyazo 링크에 있다고 죄송합니다

https://gyazo.com/f920e6004c39dc19eaadbe5f73abd7ae

, 나는 JSFiddle 링크를 업로드하려고하지만 난 등 모든 사 들여 쓰기와 코드를 업로드하는 방법을 알아낼 수 없었다, 그래서 당신이 필요한 모든 한 희망 정보.

Answer 1

상위 본부는 너비가 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>