我试图在此登录表单中添加一条与“或”一词对齐的水平线，但是我无法使其工作，因为它只会在该词下方对齐。 https://i.stack.imgur.com/12byj.png
* {
margin: 0;
padding: 0;
box-sizing: border-box
}
body,
html {
width: 100%;
height: 100%;
font-family: 'Lato', Arial, sans-serif;
}
#loginForm {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
margin: 10px 0;
}<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<link rel="stylesheet" type="text/css" href="new 1.css">
</head>
<body>
<form id="loginForm">
<input type="text" class="login-username" placeholder="Username/E-mail" autofocus="true" required>
<input type="password" class="login-password" placeholder="Password" required>
<button type="submit" class="login-submit" name="submit">Login</button>
<a id="forgotPass" href="#" class="login-forgot-pass">Forgot password?</a>
<p>or</p>
<a id="Signup" href="signup.html">Register</a>
</form>
</body>
</html>