html - ボタンが付いたテキストフィールド

Question

テキストフィールドとボタンを互いに接続するにはどうすればよいですか

これが私のデモ http://jsfiddle.net/dgWqL/2/です

Answer 1

#textfield"との間の空白を削除するだけですinput[type="button"]。（えっ？）さて、これはあなたのhtmlです：

    <input type="text" name="textfield" id="textfield" value="Search here" />
    <input name="" type="button" value="Go">

これは持っているのと同じです...

    abc
    def

...これは、疑問の余地がないでしょうが、 としてレンダリングされabc defます。

それはまったく同じことです。

私が提案したように、2番目の入力をhtmlの最初の入力の直前に置くことで、その空白を簡単に削除できます...

    <input type="text" name="textfield" id="textfield" value="Search here" /><input name="" type="button" value="Go">

別のオプションは、空白をコメントアウトすることです。これは、各入力を独自の行に配置したい場合です。

    <input type="text" name="textfield" id="textfield" value="Search here" /><!--
  --><input name="" type="button" value="Go">

ここにフィドルがあります - http://jsfiddle.net/dgWqL/3/

Answer 2

あなたはこの方法でそれを行うことができます: http://jsfiddle.net/dgWqL/2/
キーはフロートを使用してい

ます

1. レイアウトにテーブルを使用しないでください。（それは悪い習慣です。）

2. CSS プロパティを別々の行に記述します。（読みやすく）
   、 あなたがしたように繰り返しを避けやすくしますdisplay: inline-block;

この助けを願っています。