2016-04-04 28 views
0

ラベルのテキストのすぐ下にテキスト入力がある場合、入力の上とラベルの下のいくつかのスペースを埋め込み、2つのピクセルを分ける方法がありますか?ラベルと入力の間のパッド(type = 'text')?

入力ボックスのクラスの上部にパディングを追加すると、ボックスのボトムを下に伸ばし、ラベルの上から同じ距離を離します。ラベルの詰め物は効果がありません。 w3の表示スタイルをチェックして、display:blockを使用して問題が発生していたかどうかを確認しましたが、それは問題のようには見えませんでした。

新生児の質問で申し訳ありませんが、私はHTML/CSSを初めて使用しています。私は手を触れ続けて、どんな助けにも感謝します。ありがとう!

マークアップ:

 <label for='subject'style='display:block' class='label'> 
      What subject do you want to follow?<br> 
     <input type="text" id="subject" value="meaningOfLife" style="display:block" class='form-text'><br> 
    </label> 

とCSS:それはあなたが探して何か

.label{ 
    padding:5px 10px 0px 10px; 
    color: RGB(25,90,90); 
    font-size: 16; 
    font-weight: 8; 
    font-family: 'Open Sans Condensed', sans-serif;  
} 

答えて

3

ですか? 「=すべての入力に対してマージンを適用するにはform-textクラス名を持つ

.label #subject { 
    margin-top: 5px; 
} 

それともlabelタグ内にネストされ、すべての入力要素に適用

.label .form-text { 
    margin-top: 5px; 
} 

: あなたはこのようにIDによって1つの要素に適用することができますラベル内にネストされた「テキスト」要素:

.label input[type="text"] { 
    margin-top: 5px; 
} 
+1

*なぜ*この動作が役立つかは、ここで役立ちます。 –

+0

すばらしい返信とフォローアップ編集に感謝します。それはまさに私が探していたものです。ロックが解除されると受け入れます。 –

関連する問題