プロが教えるわが家の防犯対策術!

いつもお世話になっております。
ソースは以下の様となります、htmlのときが正常に表示されますが。
JSP化すると微妙が所にテーブルがずれてしまい、これを解消するにはどんな解決あるかな?
<html>
</body>
<table width="700" border="0" cellspacing="0">
<tr>
<td valign="top"><table width="100" border="1" cellspacing="0" bordercolor="#FF3366" >
<tr align="center">
<td height="23" ><img src="../Assets/Body/Common/StaffList.gif" alt="スタッフ" width="31" height="12" /></td>
</tr>
<tr align="center">
<td height="23" >田中栄子</td>
</tr>


//この部分がJSP上がループ処理となる

</table>
</td>
<td valign="top">
<div style="overflow-x:scroll; width:601px; scrollbar-track-color: #FFffff; scrollbar-face-color:#ff3366; scrollbar-shadow-color: #ff3366; scrollbar-highlight-color: #ff3366; scrollbar-arrow-color: #ffffff; scrollbar-darkshadow-color:#ffffff; scrollbar-3dlight-color:#ffffff;">
<table width="1200" border="1" cellpadding="0" cellspacing="0" bordercolor="#FF3366" >
<tr align="center" class="time_font" >
<td>


//この部分がJSP上がループ処理となる



・</td>
</tr>
</table>
 </div>
  </td>
</tr>
</table>
</body>
</html>
ちょっと長いですが、見ていただいてありがとうございます、賜りたく切にご回答をまちしておております。

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

A 回答 (3件)

質問のHTMLを見ると、とりあえずはタグの閉じ忘れ等は


無い様に思います。
#サイズ指定などがおかしいですが、たぶんHTMLも同じなのでしょう。

どのようにずれるのかがはっきりわからないので、何とも言えないのですが
とりあえず、ずれないHTMLのソースと、ずれるJSPで出力したソースを
比較してみてはどうでしょうか。

JSPのループ部でタグが閉じ忘れている可能性もありますので。
    • good
    • 0
この回答へのお礼

ご回答ありがとうございました、以上言った様な現象がないですが、文字の半角を全角に変わって見て解決しました。

お礼日時:2008/10/24 08:49

#1です。


下の回答は無視してください。
私の勘違いでした。申し訳ありません。
    • good
    • 0

JSPはjavascriptのことと解釈していいのでしょうか?



テーブルのずれ方がどのように意図と異なるのか不明ですが、多分、スクリプトから出力されたHTMLが原因ではないでしょうか。
ソースでは違うところが発見できないのでしょうから、一度、表示した状態で、アドレスバーに
 javascript:alert(document.getElementsByTagName('body')[0].innerHTML);
のように入力すると、アラート表示で出力されたHTMLを確認できます。

アラート表示するには全体が長すぎる場合は、tableタグ毎、あるいはtrタグ毎などに分割して、ループさせて確認するのがよろしいかと。

それでも発見できない場合は、表示内容をコピーしてそれをソースとしたファイルを作成し、再表示してみるなどといった方法で根気よく違うところを探していくのが結局のところ近道では?
    • good
    • 0
この回答へのお礼

お礼遅くなって、すみません。長く質問を見ていただいて、ありがとうございました。

お礼日時:2008/10/24 08:51

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

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

このQ&Aを見た人が検索しているワード

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

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>タグは一組です。(あくまでも基本的に、ですが)
これが、直接行がずれるっていうことにはならないと思いますけど…。

Qテーブル内の一部のみ線を変更する方法ってありますか?

いつもお世話になっております。どなたか教えて下さい。
無理なら無理で結構ですので不可能だと回答下さい。

あるテーブル内の一部のみ線を点線にしたり、線幅を細くする方法があれば教えてほしいのですが・・・可能でしょうか?

イメージはエクセルのように一部の罫線だけを変更したいのです。宜しく御願いします。

1つのテーブルで実現不能ならば、複数のテーブルを自由に結合する方法とかないでしょうか?

むちゃくちゃ言って申し訳ありませんが、どなたか救いの手をお願いします。

ちなみにブラウザはIE5.0か6.0だと思います。

Aベストアンサー

スタイルシートを用いることで可能です。
以下の例ではタグに直接style属性を埋め込んでいますが、
先にstyle指定をしておくと楽かもしれません。
<table border="1" bordercolor="black">
<tr>
<td style="border-top-style:dashed;border-left:3px solid red;border-bottom-width:2px;border-right-color:blue;">あああ</td>
</tr>
</table>
詳しくは、スタイルシート、CSSなどで調べてみてください。

Qテーブルのヘッダとボディの幅がズレルのを防ぐ

ヘッダとボディの幅を可変にし、かつズレないようにするにはどうすればよいのでしょうか?

Aベストアンサー

>ヘッダを固定してボディのみスクロールするため、CSSでthead の tr と、tbody に float:left; を指定しているからです。

 floatの用途を間違えています。
 floatは本来、テキスト中に挿絵などがあるとき、その要素をフローとさせて、その周囲にテキストを回りこませるためのものです。floatでブロックを並べるテクニックは、確かによく見かける手法ですが、そのために文書構造を変えなければならない----floatさせる要素は回り込む要素の前に書かなければならない---という重大な問題があります。これはHTMLやスタイルシートの目的とかけ離れています。使うならabsoluteでしょう。

 しかし、floatやabsolute、fixedは、他の要素から完全に切り離されますから、列のセル幅を引き継げません。tableの描画ルーチンに従わなくなります。

 もう一点、tableの扱いはブラウザごとに大きな差があります。また根本的な問題として、tableには他のブロック要素に使えるプロパティが使えません。height/overflowなど・・

 そのような表を作成される場合は、table,thead,tfoot,tr,tdの各要素をblock要素に置き換えて、幅をセルごとにきちんと指定して配置するのが無難です。

_<table class="scroll" summary="scrollTbody">
__<thead>
___<tr>
____<th>あ行</th><th>か行</th><th>さ行</th><th>た行</th>
___</tr>
__</thead>
__<tbody>
___<tr>
____<td>あ</td><td>か</td><td>さ</td><td>た</td>
___</tr>
___<tr>
____<td>あ</td><td>か</td><td>さ</td><td>た</td>
___</tr>
___<tr>
____<td>い</td><td>き</td><td>し</td><td>ち</td>
___</tr>
___<tr>
____<td>う</td><td>く</td><td>す</td><td>つ</td>
___</tr>
___<tr>
____<td>え</td><td>け</td><td>せ</td><td>て</td>
___</tr>
___<tr>
____<td>お</td><td>こ</td><td>そ</td><td>と</td>
___</tr>
___<tr>
____<td>あ</td><td>か</td><td>さ</td><td>た</td>
___</tr>
___<tr>
____<td>い</td><td>き</td><td>し</td><td>ち</td>
___</tr>
___<tr>
____<td>う</td><td>く</td><td>す</td><td>つ</td>
___</tr>
___<tr>
____<td>え</td><td>け</td><td>せ</td><td>て</td>
___</tr>
___<tr>
____<td>お</td><td>こ</td><td>そ</td><td>と</td>
___</tr>
__</tbody>
_</table>
に対して
table.scroll,table.scroll *{display:block;margin: 0;padding:0;line-height:30px;}
table.scroll{width:428px;margin-top:50px;border-bottom:1px solid gray;}
table.scroll thead,table.scroll tbody{width:100%;border:none;}
table.scroll tbody{height:94px;overflow:auto;width:428px;}
table.scroll thead th,table.scroll tbody td{float:left;width:100px;border:solid gray 1px;}
/* 本来はfloatではなくdisplay:inline-blockとすべきだが後方互換のためやむなくfloat */
table.scroll tbody,table.scroll tbody tr{clear:left;}

>ヘッダを固定してボディのみスクロールするため、CSSでthead の tr と、tbody に float:left; を指定しているからです。

 floatの用途を間違えています。
 floatは本来、テキスト中に挿絵などがあるとき、その要素をフローとさせて、その周囲にテキストを回りこませるためのものです。floatでブロックを並べるテクニックは、確かによく見かける手法ですが、そのために文書構造を変えなければならない----floatさせる要素は回り込む要素の前に書かなければならない---という重大な問題があります。これはHTML...続きを読む


人気Q&Aランキング