2016-04-02 12 views
1

iframeを配置するにはどうすればよいですか?私はdivの中にそれらを含めるべきであることを読んだが、私はそれを働かせるように見えることができない...iframeの配置方法

私は元のサイトの一部を表示することができるようにdivs内のiframeが欲しい私のサイトの一部だけです。

<style> 
#s1 { 
height:50%; 
width:50%; 
float:left; 
} 
#s2 { 
height:50%; 
width:50%; 
float:right; 
} 
</style> 

<body> 

<div id="s1"> 
<iframe id="my-iframe" src="www.site1.com" scrolling="no" style="position:absolute; top:-150px; left:0px; border:none; margin:0; padding:0; overflow:hidden; z-index:999999; "> 
</iframe> 
</div> 

<div id="s2"> 
<iframe id="my-iframe" src="www.site2.com" scrolling="no" style="position:absolute; top:0px; left:0px; border:none; margin:0; padding:0; overflow:hidden; z-index:999999; "> 
</iframe> 
</div> 
</body> 

答えて

0

問題はあなたがあなたが子供のために絶対的な使用を必要としないので、フロートと並んで、アイフレーム側を作りたい場合は、これらのいずれかを選択し削除する必要がありiframeためposition: absoluteを設定し、親のためのfloat: leftを設定していますiframeの場合はインラインCSSを使用し、親の場合はfloatを使用します。絶対位置を使用したい場合は、浮動小数点数を削除します。子供の絶対位置を使用する場合は、親にposition: relativeを設定する必要があります。

JSFiddle

+0

私は、これらの設定で周りの混乱にしようとしたが、私はそれが動作するように取得できませんでした。 divはiframeを決して含んでいないので、iframeは常にdivよりも優先されたようです。 – Ragatokk

+0

あなたはjsFiddleのリンクを見ましたか?あなたが望むものではありませんか? /そうでない場合は、画像で説明してください。 – Pedram

+0

jsFiddleが投稿したリンクはありません。ここで写真で何をしたいか説明しようとしました:http://i.imgur.com/ZauiUlo.png – Ragatokk