HTMLにビュアポートを設定し、スマホで見たときにはスマホ用のホームページが表示されるのですが、

iframeの部分だけ、スマホの枠から飛び出してしまいます。

imageと同じ感覚で、

iframe{
max-width: 100%;
height: auto;
}

としたところ、クロームやオペラではiframeの部分もスマホの枠に収まったのですが、IEとFIREFOXでは、どうしてもはみ出したままです。

様々なブラウザで、ifarmeの要素にmax-widthを適用させるためには、どのように記述すればよいのでしょうか。

初心者な質問ですみません。

宜しくお願いします＞＜