我正在尝试修复网站上的登录表单。当用户单击我们的登录链接时，屏幕的水平中心将显示一个“登录”表单。当用户单击“忘记密码？”时，登录表单将设置为显示：无，并且“忘记密码”表单将显示在其位置。现在，如果用户单击“忘记密码？” 然后他们单击“取消”，“忘记密码”表单消失，并且重新出现“登录”表单。重新出现登录表单时存在问题。它不再在屏幕中水平居中，而是向左对齐。
我知道我可以切换可见性，但是我不希望有空间存在，我希望将其替换为新表单。但是display：并没有太大帮助，因为它失去了一些CSS。
这是HTML（为了尊重雇主公司，我替换了src或href属性中的链接）：http : //pastebin.com/f4HMpfLk
这是CSS：http：//pastebin.com/wdwp8TqM
我有办法在不丢失样式的情况下切换初始表单的可见性吗？还是有办法让我居中？我愿意尝试更好的方法来做到这一点。谢谢
PS：我尝试更改document.getElementById（'LoginWindow'）。style.display ='inline-block'; 进行弯曲，它确实使窗口居中，但是div中的内容向左对齐，并且我在内容上失去了CSS样式。
这仅仅是因为当您重新显示登录表单时，将其显示样式设置为inline-block，不适用于自动边距。
将显示设置为block，这是a的默认设置<div>（以及隐藏之前的显示），一切都会很好。
function showRecoverPasswordForm() {
document.getElementById('recover-password').style.display = 'block';
document.getElementById('LoginWindow').style.display='none';
}
function hideRecoverPasswordForm() {
document.getElementById('recover-password').style.display = 'none';
document.getElementById('LoginWindow').style.display = 'block';
}
JS小提琴在这里：http : //jsfiddle.net/h94zLhwa/3/
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句