※ ChatGPTを利用し、要約された質問です（原文：※再々度※見ていただきたいです）
フリーソフト「alphaEDIT」を使用して作成したHPのテーブルの上下がくっつかない問題について教えてください
このQ&Aのポイント
HP初心者がフリーソフト「alphaEDIT」を使用して作成したHPのテーブルの上下が画面の上下いっぱいにくっつかない問題について、解決策を教えてください。
フリーソフト「alphaEDIT」で作成したHPのテーブルの上下がプレビュー画面ではくっついているが、インターネット上で見ると下がくっついていない問題について、なぜそうなるのか教えてください。
HP初心者がフリーソフト「alphaEDIT」を使用して作成したHPのテーブルの上下が画面の上下いっぱいにくっつかない問題について、なぜそうなるのか詳しく教えてください。
以前あまり回答が得られなかったので
カテを変えて、再度お願いいたします。
下記のようなHPをフリーソフトの「alphaEDIT」で作りました。
一番外側のテーブルの上下を画面の上下いっぱいに引っ付けたいと思っています。
プレビューでこのソースのページを見るとちゃんと上下にくっついているのですが
アップロードしてインターネット上で見ると上はくっついているのですが
下がくっついていないのです。
これがなぜなのかわかる方は、教えていただきたいです。
HP初心者なのでできるだけわかりやすく教えていただけるとうれしいです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS">
<title></title>
<style type="text/css">
<!--
BODY TD {
FONT-SIZE: 10pt
}
A.menu:link,A.menu:visited {
BORDER-RIGHT: #666666 1px solid;
PADDING-RIGHT: 15px;
BORDER-TOP: #666666 1px solid;
DISPLAY: block;
PADDING-LEFT: 15px;
PADDING-BOTTOM: 5px;
BORDER-LEFT: #666666 1px solid;
COLOR: #ffffff;
PADDING-TOP: 12px;
BORDER-BOTTOM: #666666 1px solid;
HEIGHT: 40px;
BACKGROUND-COLOR: pink;
TEXT-DECORATION: none
}
A.menu:hover,A.menu:active {
BORDER-RIGHT: #ffffff 1px ridge;
PADDING-RIGHT: 15px;
BORDER-TOP: #ffffff 1px ridge;
DISPLAY: block;
PADDING-LEFT: 15px;
PADDING-BOTTOM: 5px;
BORDER-LEFT: #ffffff 1px ridge;
COLOR: gray;
PADDING-TOP: 12px;
BORDER-BOTTOM: #ffffff 1px ridge;
HEIGHT: 40px;
BACKGROUND-COLOR: #ffffff;
TEXT-DECORATION: none
}
table#mainTable{
border-collapse:collapse;
}
td.borderAll,td.borderNoTop,td.borderNoBottom{
border:solid 1px #c0c0c0;
}
td.borderNoTop{
border-top:0px;
}
td.borderNoBottom{
border-bottom:0px;
}
-->
</style>
</head>
<body bottommargin="0" background="sozai/kabegami.gif" topmargin="0">
<table height="956" width="730" align="center" id="mainTable" style="WIDTH: 730px; HEIGHT: 956px">
<tr>
<td colspan="2" class="borderNoTop" bgcolor="#ffffff" height="20"
></td>
</tr>
<tr>
<td colspan="2" height="120" class="borderAll" background="sozai/title_back.gif">
<p align="center"><font color="#ff0000" size="5"><strong>
</strong></font> </p></td>
</tr>
<tr>
<td class="borderAll" colspan="2" valign="top" align="left" bgcolor="#ffffff"><br>
<table cellspacing="0" cellpadding="0" width="155" align="left" border="0">
<tr>
<td bgcolor="#ffffff">
<table style="MARGIN-TOP: -2px; FONT-WEIGHT: bold; WIDTH: 146px; FONT-FAMILY: 'mspゴシック'; HEIGHT: 241px" cellspacing="3" cellpadding="0" width="146" align="center" border="0">
<tr>
<td><a class="menu" href="index.html" >Ｔｏｐ</font></a></td>
</tr>
<tr>
<td><a class="menu" href="1_news.html" >Ｎｅｗｓ</font></a></td>
</tr>
<tr>
<td><a class="menu" href="2_sakuhin.html" >作品集</font></a></td>
</tr>
<tr>
<td><a class="menu" href="4_kyoushitsu.html" >お教室情報</a></td>
</tr>
<tr>
<td style="BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 10px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #666666 1px solid" align="center"><font color="gray">Ｓｈｏｐｐｉｎｇ</font></td>
</tr>
<tr>
<td><a class="menu" href="6_link.html" >お友達サイト</a></td>
</tr>
<tr>
<td><a class="menu" href="7_mail.html" >Ｍａｉｌ</a></td>
</tr>
</table></td></tr></table>
<table style="WIDTH: 560px; HEIGHT: 748px" cellspacing="1" cellpadding="20" width="560" align="left" bgcolor="#c0c0c0" border="0">
<tr>
<td valign="top" align="left" bgcolor="#ffffff">
</td></tr></table>
</td></tr>
<tr>
<td class="borderAll" colspan="2" bgcolor="#ffffff" height="20">
<p align="center"> <font color="#808080">Copyright © 2005-2007
princess-ichigo, All rights reserved.</font></font></p></td>
</tr>
<tr>
<td colspan="2" class="borderNoBottom" bgcolor="#ffffff" height="20"
>
</td>
</tr>
</table>
</body></html>
お礼
回答ありがとうございます。 そうなんですかあ。。。 結構時間をかけて作っただけにショックです・・。 でもyahoo側の操作ならば打つ手は無いですね。 すると、今のソースは一番外側のテーブルの上下の線が消える設定になっているのですが これを復活させようとすると、どこをどのように書き直せばいいでしょうか？ かなり色々いじくったため、どこを直せばいいのやら（＾＾； お答えいただけるとうれしいです。