掲示板/スタイルシート質問板/過去ログ/一覧/ きれいに並べられないのです、、、[２]

0 名前： ギンペイ ： 2007/02/01（木） 19:47 ID:h2kYEyUx sub-v7: いつもお世話になります。

２枚の画像[Ａ画像、Ｂ画像]とそれを説明する文を下記の[テーブル]で記述したように並べたいのですが。
うまくいきません。
左の画像[Ａ画像]、の右に説明の文章[銀細工から始まります]を、float: left; で配置するまではいいと思うのですが、NAVAJO INDIAN [Ｂ画像]を説明文字の上に配置させたいのですが、うまくできません。

[Ｂ画像]と説明文章をひとつのブロックで囲んで、[Ｂ画像]をさらにブロックで囲んで上下にマージンを
とりきれいに並べようとしたのですがうまくいきません。

ＣＳＳで下の[テーブルで表示させている]様なレイアウトを表示させる正しい（？）記述の方法を
お教え願えませんでしょうか、
なにとぞ宜しくお願いいたします。

<!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN'
'http://www.w3.org/TR/html4/strict.dtd'>
<HTML lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<TITLE></TITLE>
<meta http-equiv="content-script-type" content="text/javascript">

<STYLE TYPE="text/css">

</style>

</head>
<body>

<div id="con">
<p class="a"><img src="../i-jewelry/navajo.jpg" width="200" height="166"></p>

銀細工を最初に始めたのはナバホ族だと言われている、スペイン人からヨーロッパの技術を学んだメキシコ人によりその技術はナバホを通し他部族へと広まった、ズニなどのデザインの様にあまり細かいところにこだわりを持たずに、大ぶりのトルコ石やサンゴなどを大胆に、どっしりとセットして、タガネ
</div>

<br><br><br>

<table width="400" height="166"cellpadding="0" cellspacing="0" border="0" >
<tr>
<td rowspan=2><img src="../i-jewelry/navajo.jpg" width="200" height="166"></td>
<td width="200" height="20"><img src="../i-jewelry/navajo.gif" width="200" height="20"></td></tr>
<tr><td height="146">
銀細工を最初に始めたのはナバホ族だと言われている、スペイン人からヨーロッパの技術を学んだメキシコ人によりその技術はナバホを通し他部族へと広まった、ズニなどのデザインの様にあまり細かいところにこだわりを持たずに、大ぶりのトルコ石やサンゴなどを大胆に、どっしりとセットして、タガネ</td>
</tr>
</table>

</body>
</html>

1 名前： ギンペイ　加筆です。 ： 2007/02/01（木） 19:47 ID:h2kYEyUx sub-v7: 自サイトの画像で恐縮ですが、

[Ａ画像]
<img src="http://www.nizm.co.jp/i-jewelry/navajo.jpg" width="200" height="166">

[Ｂ画像]
<img src="http://www.nizm.co.jp/i-jewelry/navajo.gif" width="200" height="20">

となっています。

2 名前： 解決方法 ： 2007/02/01（木） 19:47 ID:NWxnWOn2 sub-fx: ①DIVタグをテーブルの<tr><td>要素みたいな感覚小分けして使えばいい(簡単)
②それぞれの画像の絶対配置(めんどい)
③タイトル画像のみテキスト→背景画像に置き換える

3 名前： ギンペイ ： 2007/02/01（木） 19:47 ID:ZOaCcldr sub-v7: 解決方法さん

ご回答、アドバイスありがとうございました。
三番などは色々な場合で使えそうでとても納得できます。

また何かありましたら今後とも宜しくお願いいたします。