html - Bootstrap 密码部分在点击时损坏

Question

编辑:我仔细查看了这个问题，这与它有关，不知道为什么，但在文本输入中，它正在删除未突出显示的密码输入的四舍五入，如果我删除线条，然后全部四舍五入:

.login .form-signin input[type="text"] {
  margin-bottom: -1px;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.login .form-signin input[type="password"] {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

抱歉，我不知道如何最好地表达主题，但我遇到了这个问题，密码字段的四舍五入无缘无故地出现在错误的位置，当您单击密码字段时，它会移动登录按钮向下，四舍五入进入正确的底部 2 个 Angular 。据我所知，HTML 和 CSS 与 Bootstrap 几乎相同。

这是前后对比图

之前:

之后:

您可以看到密码字段底部与登录字段之间的空间差异，并且四舍五入被破坏了。此外，这只发生在不支持 webkit 的浏览器中，例如 IE8 或 IE9。我知道它应该有效，因为它在其他登录表单中确实有效，例如 bootstrap 网站上的示例。

谢谢 - 丹

Answer 1

如果不知道你的 css 和 html 是什么样子，很难回答，但当你专注于它时，它似乎正在为密码输入添加一个类。

如果使用 chrome:检查密码字段中的元素，右键单击开发工具中的元素并选择“强制元素状态”>“:focus”。 如果有不同的属性，您应该能够通过比较强制状态和正常状态来判断