私は入力フィールドが画面の中央に配置されています。私はまた、入力フィールドの下にラベルを置いていましたが、テキストをボトムセンターの代わりに入力フィールドの左下に揃える方法を見つけようとしていませんでした。その結果、ラベルが左に動こうとしているのが見えます。ラベルに入力フィールドの下のテキストを入力の左下隅に合わせる
<!DOCTYPE html>
<html>
<body>
<div style="text-align:center">
<input type="text" name="password" value=""><br>
<label style="display:block; text-align:left">Password</label>
</div>
</body>
</html>
、
position: relative;
left: 10%;
変更にそれがラインアップになりにどんなleft値を追加します。
設定幅とラベルdisplay:inline:block
<div style="text-align:center">
<input type="text" name="password" value=""style=" width:150px;"><br>
<label style="display:inline-block; text-align:left;width:150px;" >Password</label>
</div>あなたは多分、メインのdivの内側に2つの別々のdivのを試すことができます。親divの固定幅/相対幅を指定します。このようなもの。
<div style="text-align:center;width:120px">
<div><input name="password" type="text" value="" /></div>
<div style="display: block; text-align: left"><label>Password</label></div>
</div>
DIVを使用するeasietが、完璧ではないソリューションは、ブロックレベル要素、 '表示が不要である：ブロック;'。 – hungerstar
完全に合意しました。 –
ラベルに余白を追加するだけです。
<body>
<div style="text-align:center">
<input type="text" name="password" value=""><br>
<label style="display:block; margin-right:110px;">Password</label>
</div>
</body>
をチェック、おそらく余裕 –