テーブル内に２つのテーブルを作成した場合の位置の固定

質問

ＨＴＭＬでテーブルの中に２つのテーブルを作成しました。
簡単に書くと以下のような感じです。
<table border="1">
<tr>
<td align="center" valign="top">
<table border="1">
<tr>
<td>hogehoge</td>
</tr>
</table>
<br>
<br>
<table border="1">
<tr>
<td>mogomogo</td>
</tr>
</table>
</td>
</tr>
</teble>

テーブル内の一つ目のテーブルをテーブルの上部に、もうひとつのテーブルをテーブル内の下部に表示したいのですがよい方法があるでしょうか？

回答No.2

koutarou504 · ベストアンサー

う～む・・・。
出来ましたら改めて何をしたいのか目的そのものを提示して頂けたら幸いです。
一応提示されているのは目的でなく手段の一例です。

と申しますのも、質問で提示されているタグも、＃１さんが提示されている方法を記述しても、
どちらも検証した処、同じ様に上下にテーブルが表示されました。
まぁ途中の改行(<BR>)と、質問でのタグでの</teble>という記述ミスはまぁ違いますが・・・。

で、もう少し先の事が行いたいのではないかと感じまして・・・。

尚、＃１の方のはたぶん
<table border="1">
<tr>
<td>
<table border="0">
<tr>
<td>
<table border="1">
<tr valign="top">
<td>hogehoge</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table border="1">
<tr valign="bottom">
<td>mogomogo</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>

だと思いますが、このままだと valign は無意味です・・・。
何か追記しないといけないのですが、
その為にも何を行いたいのか定時頂けたら・・・。
（この場合の理想的な表現は図でしょうが、
画像は無理として線画でなんとか表して頂ければ幸いです。）

補足

回答ありがとうございます。

大きなテーブルは実は１行３列のテーブルでして、他の列の大きさに対して高さが可変です。
hogehogeテーブル、mogomogoテーブル内には画像を表示しており、その画像を上と下とで固定したいのです。（つまり真ん中を空白にしたい）

↓こんなイメージです。分かりますでしょうか・・・。
----------------------
|　　　　|　　　　| hogehoge |
|　　　　|　　　　|　　　　　　　|
|　　　　|　　　　|　　　　　　　|
|　　　　|　　　　|　　　　　　　|
|　　　　|　　　　|　mogomogo |
----------------------

回答No.3

kwgm

＞テーブル内の一つ目のテーブルをテーブルの上部に、もうひとつのテーブルをテーブル内の下部に表示したい

<tr>…</tr>で囲まれた範囲で上下が決まりますので、

<tr>…　テーブル１　…</tr>
<tr>…　テーブル２　…</tr>

となっていれば、それで済みます。

お礼

回答ありがとうございます。
皆さんの回答をみて思考錯誤（ってほどでもないですが）しているうちに何とかできました。

以下のようにすればできるんですね。

<table border="1" height="100%">
<tr align="center" valign="top">
<td>
<table border="1">
<tr>
<td>hogehoge</td>
</tr>
</table>
</td>
</tr>

<tr align="center" valign="bottom">
<td>
<table border="1">
<tr>
<td>mogomogo</td>
</tr>
</table>
</td>
</tr>
</table>

ありがとうございました。

回答No.1

frisk_blue_love

面倒くさいと思いますが、
テーブル１（１行１列の大きなものでborder="1"）を作成して、その<td>～</td>の間にテーブル２（２行１列でテーブル１より一回り小さいものでborder="0"か指定しない・・・透明なテーブルね）を作成します。
で、テーブル２の一つ目の<td>～</td>の間にhogehogeテーブルを、二つ目の<td>～</td>の間にmogomogoテーブルを入れて、テーブル２の一つ目の<td>を<td valign="top">に、二つ目の<td>を<td valign="bottom">にすればいかがでしょうか？

ま、ホントはスタイルシート使った方がイイんでしょうけどね。

※もし、上記の日本語でよく分からなければソース貼りますよ？

補足

回答ありがとうございます。
やってみたのですが、その方法だとできませんでした。
私のソースがおかしいのでしょうか？
できればソースを教えていただけるとうれしいです。