div小包のiframeは5 pxの高さ差の問題があります
935 ワード
最近1つの問題に遭遇しました:1つのdivで1つのiframeを包んで、しかしいずれにしてもdivの高さはiframeより5 px高いです.いろいろ考えてみたが、ネットでいろいろ探してみて、問題の根源を発見した.
問題:div高さはiframe高さ5 px程度より大きい.
:HTML 5のヘッダを すると、 の2つのヘッダ を するとiframeがdivを たすことができず、5 pxの さ が します.
ソリューション:iframeにプロパティを :vertical-align:bottom;あるいはdisplay:block;
vertical-align:bottom;エレメントの を の エレメントの に わせすることを します.つまり、 エレメントに に えられたベースラインとしてエレメントのベースラインを します.
display:block;エレメントをブロックレベルエレメントに することを します.iframe はインラインフレームワークであり、divから の を し、 の としてブロックレベルのオブジェクトに すると、divに せずに しい からコンテンツを します.
インラインオブジェクトとブロックレベルオブジェクトの い:
インラインオブジェクト: の はなく、 しい から まるのではなく、 の からずっと ろに みます.
≪ブロック・レベル・オブジェクト|Block Level Objects|emdw≫: に し、 しい から に み、 を むオブジェクトに しません.
問題:div高さはiframe高さ5 px程度より大きい.
:HTML 5のヘッダを すると、 の2つのヘッダ を するとiframeがdivを たすことができず、5 pxの さ が します.
1.
2.
ソリューション:iframeにプロパティを :vertical-align:bottom;あるいはdisplay:block;
vertical-align:bottom;エレメントの を の エレメントの に わせすることを します.つまり、 エレメントに に えられたベースラインとしてエレメントのベースラインを します.
display:block;エレメントをブロックレベルエレメントに することを します.iframe はインラインフレームワークであり、divから の を し、 の としてブロックレベルのオブジェクトに すると、divに せずに しい からコンテンツを します.
インラインオブジェクトとブロックレベルオブジェクトの い:
インラインオブジェクト: の はなく、 しい から まるのではなく、 の からずっと ろに みます.
≪ブロック・レベル・オブジェクト|Block Level Objects|emdw≫: に し、 しい から に み、 を むオブジェクトに しません.