Comment résoudre ce problème d'alignement dans jQuery & CSS?

Question

La mise en œuvre est ici: http://jsfiddle.net/JWaCY/1/

Regardez le 'Mot de passe oublié?' lien. Lorsque vous appuyez sur «Enregistrer», il disparaît et lorsque vous cliquez à nouveau sur «Connexion», il revient en ligne - ce que je veux que ce soit. Juste à côté du bouton "Enregistrer".

Cependant, ce qui se passe maintenant, c'est parce que le bouton «Envoyer les instructions de réinitialisation» est juste à côté du bouton «Enregistrer» avec css afficher & valeurs de visibilité de rien et caché respectivement, au premier chargement, il montre l'espace où ce bouton serait.

Comment puis-je permettre qu'il soit entièrement caché, sans que l'espace ne soit occupé et que le 'Passe oublié?' placé juste à côté du bouton «Enregistrer» au chargement de la page?

Je préfère une solution CSS.

Je sais que je peux le faire avec jQuery simplement en exécutant un $('#pass-reset').slideUp(); quelque part dans mon JS sur le chargement de la page, mais cela montre le «Passé oublié? se déplaçant littéralement d'en bas les boutons au côté droit - qui est désordonné. Je préférerais de loin une solution plus élégante qui montre juste le passage oublié au bon endroit.

Answer 1

J'ai changé le CSS et il semble fonctionner suit:

div#sign_in input#pass-reset { 
    display: none; 
} 

Essayez ici: http://jsfiddle.net/JWaCY/2/

Hope this helps.

Bob

Answer 2

le lien de mot de passe a été oublié étant positionné par un élément invisible, qui a été ensuite basculée pour afficher none;

Il n'a aucun affichage dans son CSS mais il a été surmonté par un bloc d'affichage;

Je fais l'affichage: aucune importante et fait le bloc d'affichage de liaison avec une certaine marge sur le dessus:

http://jsfiddle.net/NfCyJ/