ログインの文字が全く移動しない

Question

ログインの文字が全く移動しないです。

<ul class="top-menu">
            <h3 class="login">ログイン</h3>

            <div class="container">
            <form action="{% url 'login' %}" method="post" role="form">
                {% csrf_token %}
            <div class="form-group">
                <label class="email_form">メールアドレス</label>
                <input for="id_email" name="email" type="text" value="" placeholder="メールアドレス" class="form-control"/>
            </div>
            <div class="form-group">
                <label class="password_form">パスワード</label>
                <input id="id_password" name="password" type="password" value="" minlength="8" maxlength="12" placeholder="パスワード" class="form-control"/>
            </div>

            <button type="submit" class="btn btn-primary btn-lg">ログイン</button>
            <input name="next" type="hidden" value="{{ next }}"/>
            </form>

            </div>
        </ul>

このh3タグのclass="login"で指定したログインの文字がCSSにどんな極端な値を指定しても全く動きません。
cssに

.login {
    margin : 1000 10 10 10;
    padding: 10 10 10 10;
}

と書いても動かなく、

.login {
    
float: right;
    
font-size: 40px;
    
margin-top:10px;
    
padding-top:-30px;
    
padding-bottom:30px;
    
padding-right:100px;
    
padding-left:10px;

}

と書いても動かないです。どうして極端な値を指定しても全く動かないのか原因がわからず。。。
何が間違っているのでしょうか？またどう直せば良いのでしょうか？

Comments

[m.ts10806]

そもそもulの中にいきなりhタグやらdivがある時点でhtml構造が崩壊しているんですけど、ひとまず、!importantでもつけてみては？　→それ以前に指定の仕方が正しくなかったですね。これはスルーしてください。

[m.ts10806]

使おうとしているタグやcssの情報をcssリファレンス、htmlリファレンスなどを読んで正しい利用の仕方をきちんと理解される方が先に思います。（前のBootflatの件もそうですね）このままではひとつ行ってはひとつ止まり、となり全く前に進みません。

Answer 1

.login {
    margin : 1000 10 10 10;
    padding: 10 10 10 10;
}

1000pxというように「px」を追加すると動作しました。

.login {( 
float: right;( 
font-size: 40px;( 
margin-top:10px;( 
padding-top:-30px;( 
padding-bottom:30px;( 
padding-right:100px;( 
padding-left:10px;( ( }

コピペしたところ、上記のように項目の末尾に不要な文字が付いています。
これをすべて削除するときちんと動作しました。