comment aligner le formulaire de connexion wp_login_form()

Question

Je voudrais personnaliser mon formulaire de connexion WordPress. Je suis un débutant dans WP et suit strictement la procédure décrite ici: https://themetrust.com/build-custom-wordpress-login-page/. Mais j'ai fait petite personnalisation supplémentaire:

require_once(explode("wp-content" , __FILE__)[0] . "wp-load.php"); 

get_header(); ?> 
<?php the_content(); ?> 

<style> 
.right{ 
position: absolute; 
right: 532px; 
width: 480px; 
border: 3px solid #73AD21; 
padding: 10px; 
} 
</style> 
<?php 
$args = array(
'echo'   => true, 
'redirect'  => site_url($_SERVER['REQUEST_URI']), 
'form_id'  => 'loginform', 
'label_username' => 'Username', 
'label_password' => 'Password', 
'label_remember' => 'Remember Me', 
'label_log_in' => 'Log In', 
'id_username' => 'user_login', 
'id_password' => 'user_pass', 
'id_remember' => 'rememberme', 
'id_submit'  => 'wp-submit', 
'remember'  => true, 
'value_username' => NULL, 
'value_remember' => false 
); 
?> 
<div> 
<table class = "right" bgcolor="#cccccc"> 
<tr> 
<td <p><a href="<?php get_template_directory_uri() .'/page-not- 
member.php'; ?>">Not member yet</a></p></td><td></td><td></td> 
</tr> 
<tr> 
<td colspan="2">Login:</td> 
</tr> 
<tr> 
    <td> <?php wp_login_form(array('redirect' => home_url())); ?> </td> 
</tr> 
<tr> 
    <td colspan="2"><a href="<?php get_template_directory_uri() 
.'/zapomnij_formularz.php'; ?>">Forgot password?</a></td> 
</tr> 
</tr> 
</table> 
</div> 

... et je suis la page de connexion comme ceci: http://ipic.su/img/img7/fs/image1.1499330136.jpg

Comment puis-je obtenir la page formatée comme ça (login/mot de passe champs d'entrée alignés): http://ipic.su/img/img7/fs/image2.1499330556.jpg?

Thank you in advance. 

Answer 1

Vous pouvez utiliser css.Below css sont formulaire de connexion css.

Voici quelques sélecteurs CSS utiles, très spécifques pour la page de connexion:

body.login {} 
body.login div#login {} 
body.login div#login h1 {} 
body.login div#login h1 a {} 
body.login div#login form#loginform {} 
body.login div#login form#loginform p {} 
body.login div#login form#loginform p label {} 
body.login div#login form#loginform input {} 
body.login div#login form#loginform input#user_login {} 
body.login div#login form#loginform input#user_pass {} 
body.login div#login form#loginform p.forgetmenot {} 
body.login div#login form#loginform p.forgetmenot input#rememberme {} 
body.login div#login form#loginform p.submit {} 
body.login div#login form#loginform p.submit input#wp-submit {} 
body.login div#login p#nav {} 
body.login div#login p#nav a {} 
body.login div#login p#backtoblog {} 
body.login div#login p#backtoblog a {} 

pour vous, je pense que css thione est nécessaire

body.login div#login form#loginform input#user_pass {} 

espère que cela vous aide