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

技術不足ですみませんが質問させてください。

tableの1セル内に、labelやselectやtextareaを横並びで表示したいのですが、
textareaが入るとその左右のアイテムが全て下詰めになります(textareaの下側と同じ高さ)。

VALIGNは試しましたが効かないようです。
ajaxを使っていて、左側のアイテムの入力内容によって右側にアイテムが追加されるような画面です。
textareaも何とか綺麗に追加したいのですが、いい方法はないでしょうか。

下に例を載せます。

<table VALIGN="top">
<td VALIGN="top">
ここにあるlabelやselectなどが下詰めになります。
【備考】 <textarea cols="20" rows="5" style="color:000000">あああ</textarea>
こちら側のlabelやselectなどもダメです
</table>

A 回答 (1件)

スタイルシートの vertical-align: middle で中央にきました。


IE8とOperaで確認。

<td valign="top">
ここにあるlabelやselectなどが下詰めになります。
【備考】 <textarea cols="20" rows="5" style="color:000000;vertical-align:middle">あああ</textarea>
こちら側のlabelやselectなどもダメです
</td>
    • good
    • 0
この回答へのお礼

ご教授ありがとうございます。
textarea側の属性なんですね。
お蔭様で解決しました。勉強になりました。

お礼日時:2009/12/03 10:15

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

このQ&Aを見た人はこんなQ&Aも見ています

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

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

QJava-jspの画面入力値保持について

画面にテキスト、ラジオボタン、リストボックス とボタンがあります。
ボタンを押すと、JAVAで処理を行い、jspのviewで表示します。

1.テキスト、ラジオボタン、リストボックスなどに値が入力、設定されている状態で
ボタンを押して処理後にテキスト、ラジオボタン、リストボックスの値が
変わらないようにしたいのですが、
その場合、たとえば、入力、設定値をセッションになどに格納しておき
jspの所で、セッションから値を設定すると言うような方法になるのでしょうか?

2.ボタン押して処理後、ラジオボタン、リストボックスの選択値も
  変えないようにしたいのですが、
  これはどのように実現するのが、適切なのでしょうか?


以上、よろしくお願いします。

Aベストアンサー

ボタンというのはフォームのサブミットボタンのことですよ?
つまり、画面遷移が起きることを前提とすると(元の同じ画面に戻るのも含みます)

テキスト、ラジオボタン、リストボックスの状態を「要求パラメータ」として
送信し、それを次画面に反映するというのが最も一般的な方法です。

フレームワーク struts のアクションフォーム&JSPカスタムタグを使うと比較的楽に
そういう画面が作れますが、多くのフレームワークでも大差ありません。
簡単な画面なら素のサーブレート+JSPでも十分作れます。

セッションでもできますが、 セッションはログイン情報などの保持など、
限定された範囲で使うのが普通です。また、結局セッションに最新の
テキスト、ラジオボタン、リストボックスの状態を送るには、「要求パラメータ」
を送信する必要があります。

AJAXを使うという方法もあります。この場合、ボタンは AJAX 処理だけを行い
画面遷移を起こさないので、サーバ側で画面のテキスト、ラジオボタン、
リストボックスの状態をもつ必要はありません。

Qtableタグとformタグの組み合わせ

tableタグとformタグの組み合わせでどのように記述すれば、構文上正しいのでしょうか?
私は下のパターンで書いておりますが、間違いでしたら早めに改めたいので
お聞きしました。

<table>
<form>
<input type="hidden" name="a" value="1">
<tr>
<td>
<input type="text" name="b" value="">
</td>
</tr>
<tr>
<td>
<input type="submit" value="OK" value="">
</td>
</tr>
</fomr>
</table>

Aベストアンサー

恐らく、<form>タグを入れると1行分の隙間ができるのでそのように記述しているのでしょう。私も4年ほど前に何かの雑誌でそのように記述しましょう、を確かに見ました。W3Cの理論を無視すれば別に表示するのだから構わないとも思います。
しかし、私の場合、今は、前者様の回答のように<table>の外に記述します。そして、スタイルシートで
<form style="margin:0px;">
とすれば、隙間が無くなります。

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

Q3つの表の外部結合

表A、B、Cの3つがあり、Aのすべての行を出力したいと考えています。
外部結合を用いるのだとは思うのですが、3つの表に対して行う場合の
書き方がわからず困っています。
ご教授いただけないでしょうか?
select * from a,b,c
where a.商品ID =b.商品ID (+) and b.商品ID (+) =c.商品ID (+)
としてみましたが、うまくいきませんでした。

Aベストアンサー

ansi構文の趣旨からいえば、結合条件と絞り込み条件は分けて書くので・・

select *
from a
left join b on (a.商品ID =b.商品ID)
left join c on (b.商品ID =c.商品ID)
where a.年月 = 任意の値

と書くのが一般的でしょうね。

Qプルダウンリストの背景色の指定

お世話になります。
現在作成しているwebページがあり、下記のようにプルダウンリストの背景色を設定しております。
<select>
<option style="background-color: #FF0000;">サンプル1</option>
<option style="background-color: #00FF00;">サンプル2</option>
<option style="background-color: #0000FF;">サンプル3</option>
<option style="background-color: #FFFFFF;">サンプル4</option>
</select>
このページにおきまして、サンプル3を選択したときに、プルダウンリストに「サンプル3」と表示され、背景色が#0000FFになるようにしたいのですが、
上記のままだと、IEでは背景色も変化しますが、firefoxですとプルダウンリスト内に「サンプル3」と表示されても背景色は白のままです。

IEとおなじ動きになるようにするには、どうしたらよいでしょうか。
ちなみに、

<select style="background-color: #FF0000">

にすると、IE、firefoxともにプルダウンリストの背景色が変更できたので、javascriptでoptionのvalueをとり、それをselectのstyleに設定できれば。。。
と考えたのですが、javascriptはほぼ無知なので、上記の方法でも解決できずでした。

簡単に解決できる方法などございますでしょうか。
もしくは、javascriptで解決できますでしょうか。

どうぞ宜しくお願いいたします。

お世話になります。
現在作成しているwebページがあり、下記のようにプルダウンリストの背景色を設定しております。
<select>
<option style="background-color: #FF0000;">サンプル1</option>
<option style="background-color: #00FF00;">サンプル2</option>
<option style="background-color: #0000FF;">サンプル3</option>
<option style="background-color: #FFFFFF;">サンプル4</option>
</select>
このページにおきまして、サンプル3を選択したときに、プルダウンリストに「サンプル3」と表示され...続きを読む

Aベストアンサー

「スタイルシートのクラス名」

<html>
<head>
<title>TAG index Webサイト</title>
<script type="text/javascript">
<!--
function chBackGround(e) {
e.className=e.options[e.selectedIndex].className;
document.getElementById('submit').focus();
}

window.onload = function() {
document.getElementById('key').className='color01';
}
// -->
</script>
<style type="text/css">
<!--
.color01 {
background-color: #FF0000;
}

.color02 {
background-color: #00FF00;
}

.color03 {
background-color: #0000FF;
}

.color04 {
background-color: #FFFFFF;
}
-->
</style>
</head>
<body>
<form name="f1" action="./DB.cgi" method="POST">
<div>
<select id="key" name="key" onchange="chBackGround(this)">
<option class="color01">
サンプル1
</option>
<option class="color02">
サンプル2
</option>
<option class="color03">
サンプル3
</option>
<option class="color04">
サンプル4
</option>
</select>
</div>
<input id="submit" type="submit" value="表示">
<input type="hidden" name="mode" value="display">
</form>
</body>
</html>

「スタイルシートのクラス名」

<html>
<head>
<title>TAG index Webサイト</title>
<script type="text/javascript">
<!--
function chBackGround(e) {
e.className=e.options[e.selectedIndex].className;
document.getElementById('submit').focus();
}

window.onload = function() {
document.getElementById('key').className='color01';
}
// -->
</script>
<style type="text/css">
<!--
.color01 {
background-color: #FF0000;
}

.color02 {
background...続きを読む

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

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

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

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

Aベストアンサー

こんなのはどうかな?

position: absolute;
bottom: 0px;


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング