问段落标记的页边距位于分隔符之外

EN

.body {
    height: 100%;
}

.error {
    color: red;
}

#chatbox {
    width: 500px;
    height: 500px;
    background-color: #93ff95;
    border: 1px solid black;
}

#loginContainer {
    text-align: right;
    height: 50px;
    line-height: 50px;
}

#loginContainer input {
    height: 25px;
    font-size: 16px;
}

input#login {
    text-transform: uppercase;
    background: none;
    color: blue;
    border: none;
}

#loginForm {
    margin: auto;
    display: block;
}

#messagesArea {
    height: 350px;
    background-color: white;
    padding: 5px;
}

#messageBox {
    height: 100px; 
    padding: 1px 1px;
}

#messageForm {
    display: none;
}

#messageBoxBlocked {
    width: 100%;
    height: 100%;
    border: none;
    border-radius: 5px;
    padding: 0;
    margin: none;
}

<div id="chatbox">
            <div id="loginContainer">
                <form id='loginForm'>
                    <span class="error">Invalid Username</span>
                    <input type="text" name="username" placeholder="Enter a username"/>
                    <input id="login" type="submit" name="login" value="Login"/>
                </form>
    
            </div>
            <div id="messagesArea">
               <p>Admin: Hey Everyone!</p>
            </div>
            <div id="messageBox">
                <button id="messageBoxBlocked">Log in to enter chat</button>
                <form id="messageForm">
                    <textarea name="messageBox" placeholder="Enter a message"></textarea>
                    <input type="submit" name="Send"/>
                </form>
            </div>
        </div>