100％テキストボックスでbgimgを設定する方法は？

Question

私は、モバイルWebアプリケーションを構築し、次のためのソリューションを探しています：

検索ボックスは幅が100％である必要があります

[searchbox [img]] 

。入力ボックスの中にimgがあります。

まず、「false」に国境+ボーダレスInputBox関数のためのdivでラップ：

はどれも十分に機能しなかった3つの解決策を試してみました。

問題は大丈夫ですが、テキストボックスの焦点には、とにかく醜い境界線が表示されます。

-

次に、位置画像に対して（左：-40px）

[textbox][img] 

問題を100％にテキストボックスの幅を設定することができず、IMGは、次の行に-40pxする敬意をラップしません;

- テキストボックスに

第三に、 背景画像、右揃え

問題：画像はクリック可能ではありません。

ヒントはこちらですか？おそらく、bg-img +相対的なimg（0x0px）クリックを捕まえるが、それはかゆみがある。

Answer 1

あなたの最初のソリューションが正常に動作する必要があり、ちょうどあなたのCSSにinput:focus {outline:none}を追加します。

http://jsfiddle.net/L9gyp/2/