CSS: центральная форма страницы горизонтально и вертикально
Как я могу центрировать форму с именем form_login по горизонтали и вертикали на моей странице?
Вот HTML-код, который я сейчас использую:
<body>
<form id="form_login">
<p>
<input type="text" id="username" placeholder="username" />
</p>
<p>
<input type="password" id="password" placeholder="password" />
</p>
<p>
<input type="text" id="server" placeholder="server" />
</p>
<p>
<button id="submitbutton" type="button">Se connecter</button>
</p>
</form>
</body>
Я пытался сделать следующее CSS, но моя форма никогда не центрируется:
#form_login {
left: 50%;
top: 50%;
margin-left: -25%;
position: absolute;
margin-top: -25%;
}