htmlフォームのレイアウト配置

登録フォームを作成しようとしていて、問題が発生しました。 jsfiddlehere 出力は下の画像のようになります画像に示されているように、相対位置または絶対位置を使用しないで、示されているようにアドレスが行頭に表示されます。マージンやパディングで修正することは可能ですか？もう1つは、アドレステキストが下に表示されている理由です。デフォルトでは先頭には表示されません。テキストエリアのためですか？事前htmlフォームのレイアウト配置

出典

2016-07-26 jayachandra chillipuri

CSS＃アドレススパン{ vertical-align：top; } –

と、親div（高さ：100px）内の子div（高さ：10px）を上、中央または下に配置する方法も知りたいです。この縦書き整列を使って整形したり、縦整列でしかテキストのみを扱うことはできませんか？ –

がverticaly 2インラインブロック要素を揃えるために...あなたのCSSにこれを追加します。あなたのケースでは：ここ

.container span { 
    padding-left: 40px; 
    display: inline-block; 
    width: 30%; 

    /* Add vertical alignment */ 
    vertical-align: top; 
}

はfiddleです。

出典

2016-07-26 08:01:24 tzi

応答のためのTyの仲間。この背後にある理由は、vertical-alignのデフォルト値がbottomのためですか？私のコードをチェックして、レイアウトを設計する効果的な方法を教えてください。効果的なやり方や改善が必要なのでしょうか？ –

と私は親div（高さ：100px）の中に子div（高さ：10px）を上、中央または下に配置する方法も知りたいです。この縦書き整列を使って整形したり、縦整列でしかテキストのみを扱うことはできませんか？ –

'inline-block'要素を使ってラベルと入力をレンダリングするのはかなりOKです。しかし、それは反応的な人にとっては難しいかもしれません。 – tzi

でおかげで、あなたはvertical-alignを使用することができ、

#address span{ 
    vertical-align:top; 
}

出典

2016-07-26 08:01:03 Sankar

このコードは、先頭にラベルを維持する必要があり

span textarea {vertical-align:top;}

あなたのCSSにこれを追加、あなたは、他のテキストにあなたのTexAreaはを整列させる必要があります。この

<span> Address <textarea cols="5" rows="10"></textarea></span>

のようなHTMLを書きますフィールド

出典

2016-07-26 08:24:10 yanguya995

htmlフォームのレイアウト配置

答えて

関連する問題