インラインフレームが下に下がってしまいます

[統計] HTMLからXHTMLへの移行を進めていますか？

0   名前： シトレ ： 2007/06/08（金） 23:00  ［URL］  ID:s5uLJ/9A sub-Cl
インラインフレームを使って、ページを作成中なのですが上手く行きません。
左にクリッカブルマップの画像を置き、右にインラインフレームを設置したいと思っています。

今はなんとか画像の横に来たのですが（前までは下に下がってしまいました）隙間を開けたいのです。
こちらや他の場所でも検索しましたが、よく分かりません。DIVタグもあまり・・・。

どなたか教えてくださると幸いです。よろしくお願い致します。
1   名前： カヅサツ ◆ThCi95HEzw ： 2007/06/08（金） 23:00  ［URL］  ID:CFc/kNLM sub-gm
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
	"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=shift_jis">
<meta http-equiv="content-style-type" content="text/css">
<title></title>
<style type="text/css">
p#menu{
	margin: 0px 40px 0px 0px; /* 数値を変えて遊ぼう */
	width: 500px;
	float: left;
}
p#main{
	margin: 0px 0px 0px 0px;
	width: 500px;
	float: left;
}
img{
	border-width: 0px;
}
</style>
</head>
<body>
<p id="menu"><img src="http://betty.jp/blanche/sample/top.gif"
	usemap="#top" alt="メニュー" title="">
	<map name="top">
		<!-- About -->
		<area shape="poly"
			coords="(略)"
			href="http://○○" target="main" alt="About">
		<!-- Priere -->
		<area shape="poly"
			coords="(略)"
			href="http://○○" target="main" alt="Priere">
		<!-- Footmark -->
		<area shape="poly"
			coords="(略)"
			href="http://○○" target="main" alt="Footmark">
		<!-- Link -->
		<area shape="poly" coords="(略)"
			href="http://○○" target="main" alt="Link">
		<!-- Top -->
		<area shape="poly"
			coords="(略)"
			href="http://○○" target="main" alt="Top">
	</map></p>
<p id="main"><iframe src="ファイルのURL" width="500" height="450"
	frameborder="0" scrolling="yes" name="main">
	<a href=""><!-- iframe要素を無視する環境のための代替リンク --></a></iframe></p>
</body>
</html>
2   名前： あえ ： 2007/06/08（金） 23:00  ID:vtCIF8GM sub-t1
他によりよい方法があるかもしれませんが、とりあえず解決法です。
head内のスタイルシートのiframe部分に、
iframe { 
width: 300px; 
height: 300px; 
margin: 100px 100px 100px 100px;
}

と書き込んでみてください。上のは一例で、上下左右100pxの間隔が開くようになってます。
詳しくはこちらhttp://www.tagindex.com/stylesheet/page/margin.html
3   名前： たま ： 2007/06/08（金） 23:00  ID:H8y/9BjZ sub-Q5
こんなのはどうでしょう。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="adimage" content="200">
<title>sample</title>
<style type="text/css"> 
<!-- 

iframe { 
width: 300px; 
height: 300px; 
} 

#main { float: right; }

--> 
</style> 
</head>
<body>




<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="230"><img src="http://betty.jp/blanche/sample/top.gif" usemap="#top" border="0" width="230" height="500">
<map name="top">

<area shape="poly" coords="86,186,90,185,95,189,102,189,109,194,119,201,120,208,116,213,119,216,117,222,120,226,118,232,93,250,89,249,60,231,59,223,62,220,61,214,61,207,60,202,75,195,78,189" href="http://○○" target="main" alt="About">
<!-- About -->
<area shape="poly" coords="170,216,163,229,142,251,139,254,141,280,195,263,198,260,199,237,191,227,182,222" href="http://○○ target="main" alt="Priere">
<!-- Priere -->
<area shape="poly" coords="77,292,83,296,84,286,88,284,91,285,92,291,92,292,95,289,100,289,104,286,109,287,105,282,107,278,111,279,115,285,123,285,128,290,133,295,137,301,143,307,151,302,156,302,157,306,151,311,152,316,150,332,147,340,145,342,96,361,93,359,84,338,79,327,76,313,74,306,74,298" href="http://○○" target="main" alt="Footmark">
<!-- Footmark -->
<area shape="poly" coords="141,363,167,363,170,363,177,358,181,358,185,364,194,365,198,369,197,374,197,385,193,398,189,405,183,406,176,404,148,392,141,389,141,383,139,371" href="http://○○" target="main" alt="Link">
<!-- Link -->
<area shape="poly" coords="82,379,97,397,104,403,112,402,115,406,114,409,111,412,110,416,112,420,107,429,105,431,100,435,93,437,86,436,80,433,75,432,69,431,65,428,59,424,55,422,54,420,49,417,47,413,50,408,54,406,54,396,57,389,64,384,72,381" href="http://○○" target="main" alt="Top">
<!-- Top -->
<area shape="default" nohref>
<!-- デフォルトエリア -->
</map>
</td>
<td width="20">
<!--width="20"←好きな隙間の数値を指定して下さい。 -->
</td>
<td width="300" valign="bottom">
<iframe src="ファイルのURL" width="500" height="450" frameborder="0" scrolling="yes" name="main">インラインフレームを使用しています。フレームを使用しないメニューはこちらになります。</iframe>
</td>
</tr>
</table>

</body>
</html>
4   名前： シトレ ： 2007/06/08（金） 23:00  ID:s5uLJ/9A sub-Cl
皆さん、ありがとうございます！
テーブルの方が崩れないかと思い、たまさんのHTMLを利用させていただきました。
おかげで、思っていた通りにできました。
感謝しています。助かりました、重ね重ねありがとうございました。
一覧へ戻る