8
私は現在、ウェブサイト上の混合メディアの回転モンタージュを開発中です。サイト上で回転するように表示される約5つの画像/ビデオがあります。このサイトではEktron CMSも使用しているため、モンタージュのどのスロットが画像になり、どのスロットがビデオになるのかを判断する方法はありません。 （ビデオはYouTubeでホストされています）iframeの内側から余分な余白を削除するにはどうすればよいですか？
私の問題は、ビデオがiframeの内側の端と完全に一致するようにロードされていますが、画像は約10pxのわずかな余白で読み込まれます。私たちのサイトは非常に正確に配置されていて、のほんの少しのバリエーションもピクセルが混乱することがあります。これは、FireFoxとIEでのみ表示されます。 ChromeとSafariでテストしたところ、完全に動作します。これらの4つのブラウザは、正式にサポートしている唯一の4つのブラウザです。
はここに私のHTMLです：次のように
<head>
<body>
<div id="mainImage">
<iframe scrolling="no" frameborder="0" runat="server" id="MainImage1"
src="http://www.youtube.com/embed/u1zgFlCw8Aw?wmode=transparent">
IFRAMES do not work in your browser</iframe>
<iframe scrolling="no" frameborder="0" runat="server" id="MainImage2"
src="images/default/mainImage/mainImage_02.jpg">
IFRAMES do not work in your browser</iframe>
</div>
</body>
</head
CSSは次のとおりです。
#mainImage iframe{position:absolute; top:0; left: 0; padding:12px 0 0 12px; display:block;}
#mainImage iframe html, body{ margin:0px; padding:0px; border:0px;}
これは、積極的に、アイフレームを表示する方法に影響を与え、サイト上のコードのみです。
私の質問は、どうすればiframe内の余白を取り除くことができ、なぜFireFoxとIEだけで表示されるのですか？
のiframeの内容は唯一のYouTubeからの埋め込まれた動画やウェブサーバからの画像のどちらかであるならば、あなたは上記のように、その後どのように私はCSSのリセットを行うことができますか？ –
クロスサイトスクリプティング攻撃を防止するために、同じ発信元ポリシーが設定されているため、別のドメインからIframeのコンテンツを制御することはできません。 –
それは既に働いているので（私はおそらくこれを行う独自のCSSを持っているので）、私はyoutubeビデオ用にCSSをリセットする必要はありません。それは私が問題を抱えている（同じドメイン内の）Webサーバーからの画像です。 –