2012-04-27 15 views
0

私はフォームをたくさん使っていないので、ここで何が起こっているのか分からない。 ボタンでテキスト入力をインラインに配置しようとしていますが、うまくいきません。あなたはここで何をしているのかを見ることができます: http://jsfiddle.net/gagalug/BEBAH/テキスト入力の位置決め?

ありがとうございます。

+0

JSFiddleは実際の例を提供するのに便利ですが、StackOverflowに関する完全な質問を提供してください。 – Quentin

+0

@Quentinシンプルなことを書こうと思っていました。次回はやります。 ;) –

答えて

1

は、あなたのスタイルに次の行を追加:これは、画像と画像入力の上、ベースラインの問題を防ぐことができます

img, input[type=image] {vertical-align: bottom;} 

。あなたの問題を即座に解決します。

あなたは知っているより多くの人々は本当にこれについて知っておくべきです。 QuirksModeほど大きなサイトを書いている人でも、この事実は知られていません。

+0

Hmmこの方法ははるかに優れているようですが、それは私のニーズに合っているので、真ん中で調整します。ありがとう。 –

0

ねえ、私はあなたがちょうどあなたの垂直整列を定義し、この

オプションたいと思う:トップを。

#text{ 
    height: 40px; 
    vertical-align: top; 

} 

ライブデモhttp://jsfiddle.net/BEBAH/4/

+0

こんにちは、ありがとう。また、それがなぜそれをするのか知っていますか?ハハありがとう。 –

+0

悪い考え。それは不必要で、あまりにも多くのことに依存しています。 –

+0

絶対配置はかなり力強いツールであり、この問題を解決するためには本当に必要ありません。 – Quentin

1

input { vertical-align: middle; } 
1

さまざまな方法があります。

親のdivと子への絶対位置に対して
  1. ポジショニング。

  2. vertical-align:middle;両方の入力用

+0

縦型作品に感謝します! = D –

0

以下のようにCSSを変更してください。

div{ 
     border: 1px solid black; 
     width: 500px; 
     height: 50px; 
     float:left; 
    } 
    #text{ 
     height: 40px; 
     top: 0px; 
     float:left; 
    }