Jak wyśrodkować iframe poziomo?

Najlepszym i prostszym sposobem wyśrodkowania iframe na swojej stronie jest:

<p align="center"><iframe src="http://www.google.com/" width=500 height="500"></iframe></p>

Gdzie szerokość i wysokość będą wielkością iframe na stronie html.

HTML:

<div id="all">
    <div class="sub">div</div>
    <iframe>ss</iframe>
</div>

CSS:

#all{
    width:100%;
    float:left;
    text-align:center;
}
div.sub, iframe {
    width: 100px;
    height: 50px;
    margin: 0 auto;
    background-color: #777;

}

Jeśli umieszczasz wideo w ramce iframe i chcesz, aby twój układ był płynny, powinieneś spojrzeć na tę stronę: Fluid Width Video

W zależności od źródła wideo i jeśli chcesz, aby stare filmy były responsywne, Twoja taktyka będzie musiała się zmienić.

Jeśli jest to twój pierwszy film, oto proste rozwiązanie:

<div class="videoWrapper">
    <!-- Copy & Pasted from YouTube -->
    <iframe width="560" height="349" src="http://www.youtube.com/embed/n_dZNLr2cME?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>
</div>

I dodaj ten css:

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

Disclaimer: nic z tego nie jest moim kodem, ale Przetestowałem go i był zadowolony z wyników.

Najprostszy kod do wyrównania elementu iframe:

<div align="center"><iframe width="560" height="315" src="www.youtube.com" frameborder="1px"></iframe></div>

Możesz umieścić iframe wewnątrz <div>

<div>
    <iframe></iframe>
</div>

Działa, ponieważ znajduje się teraz wewnątrz elementu blokowego.

Według http://www.w3schools.com/css/css_align.asp , Ustawienie lewego i prawego marginesu na auto określa, że powinny one podzielić dostępny margines równo. Wynik jest elementem wyśrodkowanym:

margin-left: auto;margin-right: auto;

Możesz spróbować

<h3 style="text-align:center;"><iframe src=""></iframe></h3>

Mam nadzieję, że to przydatne dla ciebie

Link