2011-07-19 9 views
0

BLACK矢印が指し示されている要素のすぐ下の赤い矢印の下に要素を配置する必要があります。言い換えれば、要素を2〜5ピクセルのように入力するにはどうすればいいですか?要素を十分に整える

http://i.stack.imgur.com/Q4IeX.png

コードが

CSS

form.loginform 

{ 
    font-family: Verdana,Arial,Helvetica,sans-serif; 
    font-size: 16px; 
    border-radius: 10px; 
    -moz-box-shadow: 0 0 10px rgba(0,0,0,0.5); 
    -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5); 

} 


div.divbg 

{ 
    width: 200px; 
    height: 167px; 
    position: fixed; 
    text-align: center; 
    vertical-align: middle; 
    margin-top: 30%; 
    margin-left: 40%; 
    background-color: aliceblue; 

} 

a.register 

{ 

    font-family: Geneva,Arial,Helvetica,sans-serif; 
    font-size: 11px; 

} 

#pass 
{ 
    float: inherit; 
    margin: 0; 
} 

HTML

<html> 
<head> 
<title></title> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<link rel=StyleSheet href="loginstyle.css" type="text/css" media="screen"/> 
</head> 
    <body> 
     <div class="divbg"> 
      <form method="post" class="loginform"> 
      Логин <div class="center"><input type="text" name="login"/></div><br/> 
      <div id="pass">Пароль <div class="center"><input type="text" name="password"/></div><br/> 
      <a href="#" class="register">хочу зарегистрироваться!</a><br/></div> 
      <input type="submit" name="submit" value="Войти"/><br/> 

      </form> 
     </div> 
    </body> 
</html> 
+2

私たちは、必要なコードの仲間を削除します。 – Phil

+0

ここに行きます: - ) – Umren

+0

div id passは単なるテストのためのものです。 – Umren

答えて

0

を助けるためにそう簡単ではありません。それはそれを押し下げるものです。また、inputタグの周りにいくつかのパディングがあります。これらの問題の両方がそのスペースを引き起こしているのです。

あなたのコード:

<div class="center"><input type="text" name="password"/></div><br/> 

は私達にあなたのhtml/cssのを与え、その<br />

1

1ここにある近代的なブラウザ

2放火犯をインストールしますまたは開発者ツールを使用する

3最後の入力ボックス(黒い矢印)に余白があるかどうかを確認します。

4はいいいえは、赤い矢印を持つ要素は、マージントップを持っているかどうかを確認し、それを削除するか、負のマージントップ値を設定した場合、0または負の値

5に設定します。

コードなしでは、それはあなたが#centerのdiv後<br />タグを持っているあなたに

関連する問題