締切済み

このようなソースを書いたのですが下に表示した二つのテーブルがどうしても

2010/07/11 03:22

このようなソースを書いたのですが下に表示した二つのテーブルがどうしても左よりに表示されてしまいます。一行に２つのテーブルを横に並べつつその２つのテーブルを中央に表示できないでしょうか？よろしくお願いいたします <HTML><Div Align=center><HEAD><TITLE>検索結果詳細画面</TITLE></HEAD><BODY> <BR><BR><BR> <B>検索詳細画面</B><BR> <form action='/humans/servlet/Seach' method='get'> <table bor 社員番号</th> <td width=200> sno</td></tr><tr> <th>氏名</th> <td> name</td></tr><tr> <th>ヨミガナ</th> <td> kana</td></tr><tr> <th>住所</th> <td> address</td></tr><tr> <th>生年月日</th> <td> birthday</td></tr> <tr><th>性別</th> <td> sex</td></tr> <tr><th>身長</th> <td> hight</td></tr> <tr><th>体重</th> <td> weight</td></tr> <tr><th>血液型</th> <td> blood</td></tr> <tr><th>携帯電話番号</th> <td> mtel</td></tr> <tr><th>自宅電話番号</th> <td> ttel</td></tr></table><hr /> <br>家族（扶養家族）のデータ</br> <br></br><table border=1 align=left><tr><th width=150>氏名</th> <td width=200> name</td></tr><tr> <th>ヨミガナ</th> <td> kana</td></tr><tr> <th>生年月日</th> <td> birthday</td></tr><tr> <th>性別</th> <td> sex</td></tr><tr> <tr><th>身長</th> <td> hight</td></tr> <tr><th>体重</th> <td> weight</td></tr> <tr><th>血液型</th> <td> blood</td></tr> <tr><th>携帯電話番号</th> <td> mtel</td></tr> <tr><th>自宅電話番号</th> <td> ttel</td></tr> <tr><th>続柄</th> <td> reration</td> </tr></table> <table border=1 align=left><tr><th width=150>氏名</th> <td width=200> name2</td></tr><tr> <th>ヨミガナ</th> <td> kana2</td></tr><tr> <th>生年月日</th> <td> birthday2</td></tr><tr> <th>性別</th> <td> sex2</td></tr><tr> <tr><th>身長</th> <td> hight2</td></tr> <tr><th>体重</th> <td> weight2</td></tr> <tr><th>血液型</th> <td> blood2</td></tr> <tr><th>携帯電話番号</th> <td> mtel2</td></tr> <tr><th>自宅電話番号</th> <td> ttel2</td></tr> <tr><th>続柄</th> <td> reration2</td> </tr></table><br></br><br></br><br></br><br></br><br></br><br></br><br></br>

derayedkaleido
お礼率20% (1/5)

HTML
回答数2
ありがとう数4

みんなの回答 （2）
専門家の回答

みんなの回答

rurino
ベストアンサー率55% (38/68)

2010/07/11 10:28 回答No.2

こんなのでどうでしょう… <div style="width: 600px; margin: 0 auto;">　←　style で固定幅と均等余白をとってる <form action='/humans/servlet/Seach' method='get'> <h1>検索詳細画面</h1> <table width="300" border="1" cellspacing="0" cellpadding="4"> <tr><th width=100>社員番号</th><td>sno</td></tr> <tr><th>氏名</th><td>name</td></tr> <tr><th>ヨミガナ</th><td>kana</td></tr> <tr><th>住所</th><td>address</td></tr> <tr><th>生年月日</th><td>birthday</td></tr> <tr><th>性別</th><td>sex</td></tr> <tr><th>身長</th><td>hight</td></tr> <tr><th>体重</th><td>weight</td></tr> <tr><th>血液型</th><td>blood</td></tr> <tr><th>携帯電話番号</th><td>mtel</td></tr> <tr><th>自宅電話番号</th><td>ttel</td></tr> </table> <hr /> <h1>家族（扶養家族）のデータ</h1> <table width=300 align=left border=1 cellspacing="0" cellpadding="4"> <tr><th width=100>氏名</th><td>name</td></tr> <tr><th>ヨミガナ</th><td>kana</td></tr> <tr><th>生年月日</th><td>birthday</td></tr> <tr><th>性別</th><td>sex</td></tr> <tr><th>身長</th><td>hight</td></tr> <tr><th>体重</th><td>weight</td></tr> <tr><th>血液型</th><td>blood</td></tr> <tr><th>携帯電話番号</th><td>mtel</td></tr> <tr><th>自宅電話番号</th><td>ttel</td></tr> <tr><th>続柄</th><td>relation</td></tr> </table> <table width=300 border=1 align=left cellspacing="0" cellpadding="4"> <tr><th width=100>氏名</th><td>name2</td></tr> <tr><th>ヨミガナ</th><td>kana2</td></tr> <tr><th>生年月日</th><td>birthday2</td></tr> <tr><th>性別</th><td>sex2</td></tr> <tr><th>身長</th><td>hight2</td></tr> <tr><th>体重</th><td>weight2</td></tr> <tr><th>血液型</th><td>blood2</td></tr> <tr><th>携帯電話番号</th><td>mtel2</td></tr> <tr><th>自宅電話番号</th><td>ttel2</td></tr> <tr><th>続柄</th><td>relation2</td></tr> </table> </form> </div> 1行目で設定した横幅は、下のテーブルが2つくっついた幅の合計と一緒です。

magicalpass
ベストアンサー率58% (378/648)

2010/07/11 05:23 回答No.1

<table>タグのネストが禁止されてるとかいうのじゃなければ <table border=0 align="center"><tr><th> 　～二つのテーブル～ </th></tr></table> というように２つのテーブルを外側のテーブルで括ってしまえば良いかと。

関連するQ&A

HTMLの質問なのかJAVAサーブレットの質問なのか微妙なのですがテー
HTMLの質問なのかJAVAサーブレットの質問なのか微妙なのですがテーブルを一行に二つ表示したいのですが表示はできるんですが表示位置を中央にすることができなくて困ってますどうすれば中央にすることができますか？ while(rs2.next()){ String name = rs2.getString("st.staff_name"); String kana = rs2.getString("st.staff_kana"); String birthday = rs2.getString("st.birthday"); String sex = rs2.getString("sm.sex"); String blood = rs2.getString("bm.blood_type"); String hight = rs2.getString("st.hight"); String weight = rs2.getString("st.weight"); String reration = rs2.getString("st.reration"); String mobile = rs2.getString("st.mobile_tel"); String tel = rs2.getString("st.tel"); out.println("<br></br><TABLE border=0 align=\"center\"><table border=1 align=\"left\"><tr><th width=150>氏名</th>"); out.println("<td width=200>"+name+"</td></tr><tr>"); out.println("<th>ヨミガナ</th>"); out.println("<td>"+kana+"</td></tr><tr>"); out.println("<th>生年月日</th>"); out.println("<td>"+birthday.replace("-", "/")+"</td></tr><tr>"); out.println("<th>性別</th>"); out.println("<td>"+sex+"</td></tr><tr>"); out.println("<tr><th>身長</th>"); out.println("<td>"+hight+"</td></tr>"); out.println("<tr><th>体重</th>"); out.println("<td>"+weight+"</td></tr>"); out.println("<tr><th>血液型</th>"); out.println("<td>"+blood+"</td></tr>"); out.println("<tr><th>携帯電話番号</th>"); String mtel=""; if(mobile!=null&&mobile.length()>0){ for (int i = 0; i < mobile.length(); i++) { char ch = mobile.charAt(i); if(i==3){ mtel+="-"; } if(i==7){ mtel+="-"; } mtel+=ch; if(mobile.length()==0){ mtel="-"; } } }else{ mtel="不所持"; } out.println("<td>"+mtel+"</td></tr>"); out.println("<tr><th>自宅電話番号</th>"); String ttel=""; for (int i = 0; i < tel.length(); i++) { char ch = tel.charAt(i); if(i==4){ ttel+="-"; } if(i==6){ ttel+="-"; } ttel+=ch; } out.println("<td>"+ttel+"</td></tr>"); out.println("<tr><th>続柄</th>"); out.println("<td>"+reration+"</td>"); out.println("</tr></table>");
- 締切済み
- Java
cssでテーブルの位置を設定するには？
<table border="1" align="left">でテーブルの位置を競ってすることはできたのですがスタイルシートで行いたいです。そもそも他のテーブルはすべて中央に寄せたいため、 table { margin-left: auto; margin-right: auto; } としています。そのうえで、任意のテーブルのみ左に寄せて表示したいので table.test { align:left; } としたのですが、うまくいきません。 ---------------------------------------------------------- <html> <head> <title>test</title> <STYLE type="text/css"> table { margin-left: auto; margin-right: auto; width: 40%; } table.test { width: 80%; align:left; } </STYLE> </head> <body> <table border="1"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" align="left"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> <br><br><br> <table border="1" class="test"> <tr><th>見出</th><th>見出</th></tr> <tr><td>セル</td><td>セル</td></tr> </table> </body> </html> ----------------------------------------------------- このコードだと、 table.test { width: 80%; align:left; } の、 width: 80%; の部分は認識されるようですが、align:left;は無視されます。スタイルシートでテーブルの位置を設定する方法をご教授ください。
- 締切済み
- CSS
テーブルのテーブルの間に間ができるのでしょうか？
はじめまして、超html初心者のものです。なぜ同じようテーブルを３つ書いているのに一番上のテーブルと真ん中のテーブルの間が開いてしまっているのかがわかりません。あと、一番上のテーブルの-から先をもう少し左に寄せることもうまくいきません。なにかアドバイスをよろしくお願いします。 ↓これがソースです。 <html> <head><title>test</title> </head> <form> <table border=1 cellspacing=0 cellpadding=2 width=760> <tr> <th width=95 height=30 align="right">日付け：</th> <td width=284> <input type="text"><input type="button"> </td> <td> - </td> <td><input type="text"><input type="button"></td> </tr> </table> <table border=1 cellspacing=0 cellpadding=2 width=760> <tr> <th width=95 height=30 align="right">部署：</th> <td width=100> <select name="busyo"></select> </td> <th width=80 align="right">営業所：</th> <td width=100> <select name="eigyousyo"></select> </td> <th width= 80 align="right">担当コード:</th> <td width=450> <select name="tantocode"></select> </td> 　 </tr> </table> <table border=1cellspacing=0cellpadding=2width=760> <tr> <th width=80 align="right">権限:</th> <td width=700> <select name="kengen"></select> </td> </tr> </table> </form> </html>
- 締切済み
- HTML
テーブルが一行下がる・・・
HTMLを作成していて、横一列に並べたいのに何故か一行下がってしまいます。具体的には、 <TABLE width="50" border=1 align=left> <TBODY> <TR><TD noWrap align=middle>項目A</TD> <TR><TD noWrap align=middle Height=80><BR></TD></TR> </TBODY> </TABLE> <TABLE width="20" border=1 align=middle> <TBODY> <TR><TD noWrap align=middle>タイトル</TD></TR> </TBODY> </TABLE> <TABLE width="50" border=1 align=right> <TBODY> <TR><TD noWrap align=middle>項目B</TD></TR> <TR><TD noWrap align=middle Height=80><BR></TD></TR> </TBODY> というソースで、「項目A」→「タイトル」→「項目B」と横一線に並べたいのですが、何故か「項目B」が一行下がって表示されます・・・ HTMLを作るのは初めてで、色々と調べたのですがよく分かりませんでした・・・。どなたか助けてください！！よろしくお願い致しますm(_ _)m
- ベストアンサー
- HTML
tableタグの中にtableタグ
tableタグの中にtableタグ課題をやっています。ホームページを作っていて、画像のようなページを今作っています。僕が書いたタグはこうです。（途中ですが、何か違うんだと思います。) <html> <head><title>FOMデンタルクリニック</title></head> <body bgcolor="#99ccff" background="images/back.jpg" link="#cc0000" vlink="#663333" alink="#cc9999"> <table width="600" height="400" align="center" bgcolor="#ffffff" valign="top"> <tr><td><font size="2">完全予約制となっておりますので、あらかじめご予約ください。</font></td></tr><br> <tr><td><hr></td></tr> <tr><td><b><font size="4" color="#000099" align="left">診療科目</font></b></td></tr><br> <br> <tr><th align="left"> <ol> <li>一般歯科</li> <li>矯正歯科</li> <li>審美歯科</li> </th></tr><br> <br> <br> <tr><td><b><font size="4" color="#000099" align="left">診療時間</font></b></td></tr><br> <table width="500" height="90" align="center" border="1"><tr bgcolor="#ffcccc" align="center"> <th>時間</th> <th>月</th> <th>火</th> <th>水</th> <th>木</th> <th>金</th> <th>土</th> <th>日</th> </tr> <tr> <th>午前(9時～12時)</th> <th>○</th> <th>○</th> <th>○</th> <th>○</th> <th>○</th> <th>○</th> <th>×</th> </tr> <tr> <th>午後(15時～18時)</th> <th>○</th> <th>○</th> <th>×</th> <th>○</th> <th>○</th> <th>×</th> <th>×</th> </table> <tr><td><b><font size="4" color="#000099" align="left">ご予約方法</font></b></td></tr><br> <br> <tr> <th align="left"> <ul> <li>予約専用フリーダイヤル（0120-333-XXX）にお電話ください。</li> <li>予約専用メールアドレス（yoyaku@fom）にお名前と希望日時をご記入の上、お申し込みください。</li> </th> </tr> </table> <a href="index.htm"><img src="images/button.gif" border="0"></a> </body> </html> 何が違うんでしょうか？ tableの中にtableを使ってるからでしょうか^^; ググってもよく分からないので教えてください。よろしくお願いします。
- 締切済み
- HTML
IEのテーブル表示の不具合でしょうか・・・？
IEで正しく表示されているものが、別のページへ行って「戻る」ボタンを押すと、テーブルの表示が崩れてしまいます。２列のテーブルの右側の部分が左側にかぶって表示されてしまうのです。参考までにその部分のソースを以下に記述します。何か気になる点などお気づきになられたら教えてください。 <table width="320" border="0" cellspacing="0" cellpadding="0"> <tr> <td width="200"> <table width="200" border="0" cellspacing="0" cellpadding="5"> <tr> <td class="px12"> ・<a href=>あああああ</a><br> ・<a href=>いいいいい</a><br> ・<a href=>ううううう</a><br> <hr width="160" size="1" noshade align="left"> ・<a href=>えええええ</a><br> <hr width="160" size="1" noshade align="left"> ・<a href=>おおおおお</a><br> <hr width="160" size="1" noshade align="left"> </td> </tr> </table> </td> ※以下から左側のテキストにかぶって表示されてしまいます。 <td width="120"><a href=><img src="images/画像.gif" width="120" heigt="180" border="0"></a><br> <table width="120" border="0" cellspacing="2" cellpadding="0"> <tr> <td valign="top"><img src="images/矢印画像.gif" width="11" height="11" border="0"></td> <td class="px12"><a href=>テキストテキストテキスト</a></td> </tr> </table> </td> </tr> </table> 以下が私の環境です。 WindowsXP(HomeEdition)・SP2インストール済・IE6 よろしくお願いします。
- ベストアンサー
- その他([技術者向] コンピューター)
HTMLでテーブルを縦に並べたい！
基本的な質問でお恥ずかしいのですが、困っています。テーブルを二つ、縦に並べたいのですが、何故か横に並んでしまいます。どこが悪いのでしょうか？初心者ですみません…お知恵をお貸しください(T_T)。 <caption><font color="#ff0000">●</font>A <font color="#0000ff">●</font>B</font></caption> <table bgcolor="#80ffff" border="1"cellspacing="0" bordercolor="#0000ff" align="left"> <tr><th width="30"><font size="+5"><font color="#ff0000">●</font></th> <th width="150"> <font size="+4"><strong><big>C</big></strong></font></th> <td><font size="+2">D<br>E</font></td></tr> <tr><td></td><td><div align="center"> <font size="4" color="#8080ff"> 準備中</font></div></td><td></td></tr></table> </p></div> <p></p> <table align="center" bgcolor="#80ffff" height="20" width="250" border="1" cellspacing="2" cellpadding="0"> <tr><td><blink>HOME</blink></td></tr> </table> </body>
- ベストアンサー
- HTML
テーブルだらけのページをスッキリさせたい
いま、ホームページビルダーで趣味のサイトを作っているところなのですが、 HTMLのことでわからない事があるので教えてください。現在、大きなテーブルの中にさらに小さなテーブルをいれています。そのためタグがとてもごちゃごちゃしています。小さなテーブルはサイト更新の度に追加していく予定なので、見た目よりデータが重いページになってしまうと思います。これをなんとかスッキリさせたいのですが良い方法はあるでしょうか？スタイルシートを使えばいいのでしょうか？どのように使用すれば無駄の無い形になるか具体的なアドバイスをいただけると助かります。参考までに作りかけのタグを載せました。悪い部分等があったら、ぜひお願いします。よろしくお願いします。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>サイト名「タイトル未定」</TITLE> </HEAD> <BODY> <CENTER> <TABLE border="0" cellpadding="0" cellspacing="0" width="840"> <TBODY> <TR> <TD colspan="2" align="center" height="40">サイト名　タイトル</TD> </TR> <TR> <TD colspan="2" align="center">サイトの説明と注意事項</TD> </TR> <TR> <TD colspan="2" height="15"> <HR> </TD> </TR> <TR> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#009900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">チューリップ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月1日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> <TD align="center"> <TABLE border="1" cellpadding="2" cellspacing="1" bordercolor="#000000"> <TBODY> <TR> <TD rowspan="3" width="100" height="100" align="center" bgcolor="#999900">花の写真</TD> <TD width="80"><FONT size="-1">花の名前</FONT></TD> <TD width="150"><FONT size="-1">さくら</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">分類</FONT></TD> <TD width="150"><FONT size="-1">あああああ</FONT></TD> </TR> <TR> <TD width="80"><FONT size="-1">撮影日</FONT></TD> <TD width="150"><FONT size="-1">2008年4月2日</FONT></TD> </TR> <TR> <TD colspan="3" height="80"><FONT size="-1">花の特徴など<BR> あああああああああああああああああああ<BR> いいいいいいいいいいいいいいいいいいいいいいいい<BR> うううううううううううううううううううううううう。</FONT></TD> </TR> </TBODY> </TABLE> <BR> </TD> </TR> <TR> <TD align="center"></TD> <TD align="center"></TD> </TR> <TR> <TD colspan="2"> <HR> </TD> </TR> </TBODY> </TABLE> </CENTER> </BODY> </HTML>
- ベストアンサー
- ホームページ作成ソフト
tableでレイアウトが崩れる場合
技術の足りなさからCSSにできなかったので、再度テーブルでサイズを指定してやってみようとしているところです。どこかの数字がおかしくなっていると思うのですが、どうしてもわかりません。ちゃんと表示できるブラウザとそうでないブラウザがあり、Firefoxは環境設定により表示が崩れる場合があります。使用ソフトはビルダーの１１です。なんでも良いのでどうぞアドバイスをよろしくお願い致します。 <body> <div ALIGN="center"> <table> <tbody> <tr> <td CLASS="td4" HEIGHT="70"> <table WIDTH="600" CELLSPACING="1" CELLPADDING="0"> <tbody> <tr> <td VALIGN="top" CLASS="td1" WIDTH="400" ALIGN="left" HEIGHT="180"> <b>文字 <textarea ROWS="15" COLS="70">文字</textarea><br> <br> </td> <td VALIGN="top" CLASS="td1" WIDTH="100" HEIGHT="180"> <table CELLSPACING="0" CELLPADDING="4"> <tbody> <tr> <td CLASS="td2" HEIGHT="16" WIDTH="100">文字</td> </tr> </tbody> </table> 文字 <br> </td> </tr> </tbody> </table> </td> </tr> </tbody> </table> <br> </div> </body>
- ベストアンサー
- HTML
テーブルの背景を変える
js(外部ファイル)から呼び寄せる方法で１段目と３段目のセルが赤、２段目と４段目のセルが青にする方法分かりやすくいいますと、奇数が赤、偶数が青になる方法を教えてもらいたいです。 <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> </head> <body> <table border="1"> <col span="6" width="85" align="center"> <th>ID</th> <th >NO</th> <th >Name</th> <th >身長</th> <th>体重</th> <th >その他</th> </table> <table border="1"> <col span="6" width="85" align="center"> <tr> <td>1</td> <td>1</td> <td>1</td> <td>1</td> <td>1</td> <td>1</td> </tr> <tr> <td>2</td> <td>2</td> <td>2</td> <td>2</td> <td>2</td> <td>2</td> </tr> <tr> <td>3</td> <td>3</td> <td>3</td> <td>3</td> <td>3</td> <td>3</td> </tr> <tr> <td>4</td> <td>4</td> <td>4</td> <td>4</td> <td>4</td> <td>4</td> </tr> </table> </body> </html>
- ベストアンサー
- JavaScript

このようなソースを書いたのですが下に表示した二つのテーブルがどうしても

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ
一覧

専門家に質問してみよう
専門家登録

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

このようなソースを書いたのですが下に表示した二つのテーブルがどうしても

みんなの回答

関連するQ&A

注目のQ&A

カテゴリ 一覧

専門家に質問してみよう 専門家登録

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

カテゴリ
一覧

専門家に質問してみよう
専門家登録