同个css文件为什么会有些样式生效有些不生效？

最后两个：p和.login_button无法生效，我对P使用class、span都不能生效

<div class="entireInterface">
        <div class="logo">
            <img src="imgs/basshead.gif" >
        </div>
        <div class="loginInterface">
            <form class="loginForm">
                <div class="inputEmail">
                    <p>Email</p>
                    <input type="text" name="email" placeholder="email"></input>
                </div>
                <div class="inputPassword">
                    <p>Password</p>
                    <input type="password" name="password" placeholder="password" ></input>
                </div>
                <div class="login_button">
                    <input type="submit" value= "login"></input>
                </div>
            </form>
        </div>
    </div>

*{
    margin: 0;
    padding: 0;
}
body{
    margin: 1em 10%;
    background-color: #ddd;

}

form{
    background-color: #fb5;
}
.entireInterface{
    text-align: center;

}
img{
    width: 3em;
    height: 3em;
}
form{
    width: 10em;
    margin-left:auto;
    margin-right:auto;
    opacity:0.4;
    
p{
    margin-left: auto;
    font-size:0.1em; 
}
.login_button{
    background-color: blue;
}