液体テキストフィールドは、

Question

が、私はこの非常に単純な形を持っている幅。

テキストフィールドとボタンを1行にしたいが、size属性を指定しても、テキストフィールドの幅がブラウザ間で矛盾しています。正確な幅を指定したくない場合（特にボタンの場合）、テキストフィールドに液体の幅を与えることが可能かどうか疑問に思っていましたか？私はそれとボタンの両方が1行に収まるように、テキストフィールドを伸ばしたい。

Answer 1

はいlengthは幅ではなく文字数です。

ボタンが占める空き領域をすべて埋めるようにテキストボックスを設定しますか？これはテーブルで行うことができます（しかし、私は一貫してスタックオーバーフローでテーブルを示唆しています）。あなたがdisplay：tableでDIVを使う議論のために、実際のテーブルマークアップを使って簡単に説明しましょう。

<table cellpadding=0 cellspacing=0 width=100%> 
    <tr> 
     <td><input type="text" style="width:100%"></td> 
     <td style="width:0"><input type="submit"></td> 
    </tr> 
</table> 

ボタンセルの幅0は奇妙に見えるかもしれませんが、テーブルセルの幅は推奨値としてのみ使用されます。どのように痩せてもコンテンツにフィットするように伸びます。

Answer 2

デフォルトの送信ボタンスタイルを保持すると、その幅はブラウザごとに異なります。これはまた、あなたが求めるテキストフィールドの幅が変数であることを意味します。

• FF：47px + 3px国境
• はクローム：45px + 2ピクセルの境界線
• IE8：63px + 8pxパディング+ 3px境界
• IE7：61px + 2ピクセルの境界線

がありますこれを行うにはエレガントな方法はありませんが、次のオプションがあります。

• 検索ボックスにテーブルを使用）。
• 入力フィールドと送信ボタンの両方をスタイルします（推奨しません）。
• スクリプトを使用します（推奨されません）。