専門家に聞いた!繰り返す痔の原因は!? >>

formのinputやtextareaなどの幅を、100%の指定(テーブルの中などにぴったり収まるように)をしたいのですが、できないのでしょうか?

少しずつ様子を見ながら、ちくちくとsizeを指定していくしかないのでしょうか?

A 回答 (1件)

 例えば、こんな感じでは如何ですか↓



<form method="POST" action="cgi-bin/xxx.cgi">
<table border=1 width=400>
<tr>
<td>
タイトル:
</td>
<td width=350>
<input type="text" name="title" style="width:100%">
</td>
</tr>
<tr>
<td colspan=2>
<textarea name="memo" style="width:100%" rows=4>
formのinputやtextareaなどの幅を、100%の指定(テーブルの中などにぴったり収まるように)をしたい
</textarea>
</td>
</table>
<input type="submit" value="送信">
<input type="reset" value="取消">
</form>

参考URL:http://www.tohoho-web.com/css/reference.htm#width
    • good
    • 1
この回答へのお礼

回答ありがとうございます!
幅をぴったりにできるのですね!
style="width:100%"

ということは、CSSでなら指定できるということですね?
外部のCSSしかやったことがありませんが、
この場合は、直接CSSを書き込んでいるということですよね。
勉強になりました。
ありがとうございました!

お礼日時:2006/12/16 16:37

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

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

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

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

Qhtmlでテーブル内にテキストボックスを作りたいのですが・・・

教えてください。

2行のテーブルを作ろうとしています。
1行目が項目で
2行目が入力できるようにしたいです。

入力できるようにしたいので
テーブル内にテキストボックスを作ったのですが
どうしてもテーブルを作る囲い線と
テキストボックスの右側の間に余白ができてしまいます。

テキストボックスの下にできる余白は
<form>
<table>
</table>
</form>
という感じで、テーブルをフォームで囲むことで
無くすことができました。

HTMLでこの余白を消せる方法がありましたら
ぜひ、教えてください。
よろしくお願いしますm(__)m

Aベストアンサー

ANo.1です。
「1行目が項目で2行目が入力」という事は、tableの構成は正しくはこうでしたね。

(省略)
<tr>
<th>項目名</th>
</tr>
<tr>
<td><input type="text" size="50" maxlength="100" name="hoge01" value=""></td>
</tr>
(省略)

失礼しました。でも、この結果でも同じですよ。

ただし…仮に、「項目名」に相当するデータのボリュームが、2行目の入力フィールドの長さより相対的に長くなってしまえば、当然余白はできますが。
そういう問題ではないですよね?

QHTMLフォームのSELECTの幅を一定にするためには?

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか?

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">

QCSSでボックス幅を文字列に合わせたい

ボックス幅を文字列の幅に合わせるにはどうしたらいいのでしょうか。
テーブルではセルにwidth属性を指定しなくても文字列の幅になりますが、ボックスではwidthプロパティを指定しなかったら領域全体の幅になります。white-spaceプロパティでnowrap指定し、widthプロパティで文字列より小さいサイズに指定するとできるのですが、他に指定する方法があれば教えて下さい。

Aベストアンサー

div等のblock要素ではなくspan等のinline要素によって行う。

<span style="border:solid 1px">文字幅に合わせた枠線</span>

Qテーブル内の文字サイズを変更したい。

HTMLのテーブル内の文字サイズを変更したいのですが。
イマイチ上手くいかずに悩んでいます。
出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
<TD>タグや<TR>タグのところでいじくるのですか?

Aベストアンサー

いろいろやり方はありますが
文字単位でサイズを変更するには
#2の方法ですね。

テーブルごとやセル(<TD>)ごとにサイズを変更するには
スタイルシート(CSS)を使用します。

テーブルごとにサイズを変更する場合
<TABLE style="font-size : 20px;">

セル(<TD>)ごとにサイズを変更する場合
<TD style="font-size : 20px;">あああ</TD>

#1の方法だとページ内の全てのセル(<TD>)に設定することになります。

スタイルシート(CSS)はこれら以外にも
いろいろな設定方法があります。

Qボタンを横に並べて表示させる方法

<input type="button"> ←このボタンを、並べて表示させるにはどうしたら良いでしょうか? (tableは使わない方法で) よろしくお願いいたします

Aベストアンサー

ソースをください。

inputはインライン要素なので改行は入らないです。

Qでテキストボックスとセルの間にわずかな隙間があいてしまう・・

<TABLE>
<!-- ここから10回ほど繰り返し -->
<TR>
<TD>
<INPUT TYPE="TEXT">
</TD>
</TR>
<!-- ここまで -->
</TALBLE>

こう書くときに、テキストボックスの下にわずかな隙間が
できるのを防ぎたいのですが、何か方法はありませんでしょうか?

Aベストアンサー

隙間をつくってしまう原因はいくつかあります。

(1) <TABLE>タグ
BORDER=0またはNOBORDERにする。
CELLSPACING=0
CELLPADDING=0

(2) <INPUT TYPE="TEXT">前後の改行
<TD><INPUT TYPE="TEXT"></TD>

(3)<FORM>や</FORM>タグの記述場所
恐らくこれが原因でしょう。
上記には記述されていませんが、
<TABLE>
<TR>
<TD>
<FORM ~>
</TD>
</TR>
<!-- ここから10回ほど繰り返し -->
<TR>
<TD>
<INPUT TYPE="TEXT">
</TD>
</TR>
<!-- ここまで -->
<TR>
<TD>
</FORM>
</TD>
</TR>
</TABLE>
としていませんか?
HTMLとしては好ましくないと思いますが、<FORM>や</FORM>の前後にある<TR><TD>~</TD></TR>を取り除き、以下の様にします。
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0>
<FORM ~>
<!-- ここから10回ほど繰り返し -->
<TR>
<TD><INPUT TYPE="TEXT"></TD>
</TR>
<!-- ここまで -->
</FORM>
</TABLE>

尚、表の罫線を残すのであればBORDERを変更したりしてください。

隙間をつくってしまう原因はいくつかあります。

(1) <TABLE>タグ
BORDER=0またはNOBORDERにする。
CELLSPACING=0
CELLPADDING=0

(2) <INPUT TYPE="TEXT">前後の改行
<TD><INPUT TYPE="TEXT"></TD>

(3)<FORM>や</FORM>タグの記述場所
恐らくこれが原因でしょう。
上記には記述されていませんが、
<TABLE>
<TR>
<TD>
<FORM ~>
</TD>
</TR>
<!-- ここから10回ほど繰り返し -->
<TR>
<TD>
<INPUT TYPE="TEXT">
</TD>
</TR>
<!-- ここまで -->
<TR>
<TD>
</FORM>
</TD>
</TR>...続きを読む

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化したほうが、可読性が高くなると
思います。

Qtextareaの幅を画面と合わせたい

HTMLのテキストエリアで画面サイズに合わせたいのですが、
何か方法はないでしょうか。
お知恵を貸してください。

<textarea name="addtext" cols="35" rows="25"></textarea>
これだと固定になってしまいます。

<textarea name="text" width=30% height=100%></textarea>
イメージ的にはこんなことをしたいのです。

Aベストアンサー

CSSで指定すればできますよ。
こんな具合に↓
(前略)
<head>
<style type="text/css">
tablearea{
width:100%;
height:30%;
}
</style>
</head>
<body>
<textarea></textarea>
</body>
</html>

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;">
とすれば、隙間が無くなります。


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

このカテゴリの人気Q&Aランキング