iframe要素を中央に寄せたいのですが

質問

https://teratail.com/questions/80344
の様にiframe要素を中央に寄せたいのですが
「margin: auto;で中央寄せしたい場合はiframeにdisplay: block;をかけてあげれば良いです。」
との事ですが

iframe {
display: block;
margin:auto;
}
margin: 0 auto;

にしてもダメでした。
このリンクの通りやれば出来るものなのでしょうか？

回答No.1

4017B

直に iframeタグにスタイルを指定しても一部の要素は無視されるため、divで囲ってから間接的にスタイル指定した方が何かと上手く行きます。

<style>
.my-frame
{
margin: 0 auto;
width: 640px;
}
</style>

<div class="my-frame">
<iframe>～</iframe>
</div>

～以上の様な感じにすれば iframeが中央寄せになります。注意点としては必ず width:*px; を指定してやる事。CSSの仕様で横幅サイズ指定無い場合、margin: 0 auto; は無視されます(仮に縦方向に中央揃えにする場合も同じく、heightの指定が必須になります)。