新規無料会員登録で1000名様に電子コミック1000円分が当たる!!

<table>

<tr valign="top">
<td rowspan="2"> <img src=""><img src="">・・・・<img src=""></td>
<td><img src=""></td>
<td><img src=""></td>
</tr>

<tr valign="top">
<td><img src="A"></td>
<td><img src="B"></td>
</tr>

</table>

画像のサイズはすべて同じです。

1行目の画像は全て上寄りになりますが、2行目の img src="A" img src="B" が上寄りにならず、中ほどの位置にきてしまいます。
tr に指定せず、td に valign="top" を指定しても変わりません。

どうしてもわからずこちらに質問しました。
よろしくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (2件)

tableにboder="1"をいれて罫線を表示させれば分かると思いますが、右上のセルにHEIGHT指定をしてないので、自動で上下のセルが均等に表示されているのではないでしょうか。


元の画像がどのようなサイズかは分からないので予想でしかありませんが。
どのような目的でこのような使い方をしているか分かりませんが、CSSで指定したほうがいいかもしれません。
    • good
    • 0
この回答へのお礼

理解できました!セル内のtopにはなってるのですね。ありがとうございます。
それより「CSSで指定したほうがいい」と言われている意味がわからないのですが、お時間がありましたら詳細をおねがいしたいのですが・・。
何か配置のやり方が普通とは違うのでしょうか?
独学でしかやったことがないので気になります。よろしくお願いします。

お礼日時:2006/10/23 12:43

#1です。


>CSSで指定したほうがいい」と言われている意味がわからない

最近のHTMLの理念上、レイアウトはHTMLではなくCSSでやるのが望ましいと言う定義になっています。
HTMLは構造化のみの記述にするべきであり、純粋な表以外でTABLEタグは使うべきではない。ということに世の中はなっているみたいです。
まぁ、個人的にはTABLEタグを結構使っているのでおまえが言うなよという話ですが・・・
この先CSSを活用したほうがいい場面が多くなるでしょうから、CSSを覚えるのもいいと思います。
    • good
    • 0
この回答へのお礼

なるほどです。勉強になりました。ありがとうございました。
(遅くなりました、すみません)

お礼日時:2006/11/03 21:26

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aと関連する良く見られている質問

Q 内のテーブルを上寄せにするには?

すみません教えていただけますか?
初心者です。
このまま表示するとTABLE A の直ぐ下のテーブルが中央に来てしまいます。
上寄せにしたいのですが、どのようにすればよいでしょうか?

よろしくお願いします。

<table width="960" border="1">
<tr>
<td width="160">

<!-- TABLE A -->
<table width="160" border="1">
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
</td>
</tr>
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
</td>
</tr>
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
</td>
</tr>
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
</td>
</tr>
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
</td>
</tr>
</table>
</td>

<td width="800" height="1200" border="1">

</td>
</tr>
</table>

すみません教えていただけますか?
初心者です。
このまま表示するとTABLE A の直ぐ下のテーブルが中央に来てしまいます。
上寄せにしたいのですが、どのようにすればよいでしょうか?

よろしくお願いします。

<table width="960" border="1">
<tr>
<td width="160">

<!-- TABLE A -->
<table width="160" border="1">
<tr>
<td>
<a href="" ><img src="subMenu.gif" /></a>
...続きを読む

Aベストアンサー

TABLE Aを入れているtdに対してvalign="top"を入れると
解決しますよ。

Qテーブルで文字が上揃えになりませぬ

<table width="610" valign="top">
<tr>
<td width="170">てすてすてすてすてすてすてすてすてすてすてすてす</td>
<td width="50"></td>
<td width="170">てすてす</td>
<td width="50"></td>
<td width="170">てすてす</td>
</tr>
</table>

よろしくおねがいします

Aベストアンサー

tableにはvalign属性はないです。
tdに付けるか、cssでまとめて。
<style type="text/css">
td {vertical-align:top;}
</style>

Qテーブルの表示がずれます

htmlを書いているのですが、テーブルの行を増やすたびに、ブラウザで表示するとテーブルの表示がだんだん下の方へずれてしまいます。友人に聞いたところ、彼も同じような現象が起こるようです。
このようにならないようにしたいのですが、専門書を読んでも分かりません。
ちなみにhtmlソースはこのようになっております。
(1)行が1つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト1</h3>
<table>
  <tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
</table>
</body>
</html>

(2)行が2つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト2</h3>
<table>
  <tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
<tr>
   <td>テスト</td>
   <td>1</td>
   <td>2</td>
  </tr>
</table>
</body>
</html>
宜しくお願い致します。

htmlを書いているのですが、テーブルの行を増やすたびに、ブラウザで表示するとテーブルの表示がだんだん下の方へずれてしまいます。友人に聞いたところ、彼も同じような現象が起こるようです。
このようにならないようにしたいのですが、専門書を読んでも分かりません。
ちなみにhtmlソースはこのようになっております。
(1)行が1つの場合
<html>
<head>
<title>テスト</title>
</head>
<body bgcolor = "white">

<h1>テスト</h1>
<h3>テスト1</h3>
<table>
  <tr>
   <td>テスト</td>...続きを読む

Aベストアンサー

こんにちは。
イマイチどうしたいのかがよく判らないので、具体的な説明を補足してください。
ソース自体は間違いではないと思いますが…。
<tr>や<td>の前にある空白はもちろん半角空白ですよね?全角だと不具合がでます。

行が増えると下に表が大きくなるのは必然ですし。
行が1行のものと、2行のものとでは、ページが違うんですよね?
もし、同じページに表示するのであれば、1ページにつき、<html>タグは一組です。(あくまでも基本的に、ですが)
これが、直接行がずれるっていうことにはならないと思いますけど…。

Qcssで「下よせ」ってどうやっていますか?

フロートのレフト、ライトはいいとして、

あるボックス要素内(A)に異なるボックス要素(B)をいれます。
この(B)を(A)の一番そこにはりつかせたい時にどうすれば
最もよいのでしょうか?

いいアイデアをご教授ください。

Aベストアンサー

こんなのはどうかな?

position: absolute;
bottom: 0px;

Qテーブルセル余白(例えば左側だけ、上側だけ、など)

こんにちは。
宜しくお願いいたします。

テーブル内のコードに、cellpadding="5" は
セル余白が上下左右のすべて、5ピクセル空きますが、

左側だけ5ピクセル、とか、上側だけ5ピクセル、のように
指定方向のみ、余白を作ることは可能でしょうか。

その場合のHTML記述を教えてください。

また、ここで質問させていただいている「指定方向への余白指定」と
全体余白指定の「cellpadding="XX"」は同時に使って
良いものでしょうか。
素人質問ですみません。
宜しくお願いいたします。

Aベストアンサー

1つのセルだけなら、下記で。
<td style="padding: 5px 10px 20px 30px;">
上の例は、上が 5px。 右が 10px。下が 20px。 左が 30px。
適当に数値変更してください。
cellpadding="5" と style="padding: 5px;"は同じになるはず。
<td style="padding: 5px;">

両方使うとどうなるかは、試して下さい。
cellpadding をここ数年利用していないので・・・

複数個所利用するなら、NO.1さんを参考に HEAD内に下記を入れて試してみましょう。
<style type="text/css">
<!--
td {padding: 5px 10px 20px 30px;}
-->
</style>


人気Q&Aランキング