Javascript 当输入框的焦点位于signin字段时，将创建空间

我正在登录页面上工作，并最终使用JQuery，我希望除了小问题外，一切都正常。我的意思是当password字段仅在IE 8及更高版本上获得其焦点时，就会创建空间

问题是：当密码字段仅集中在IE8上的登录字段上时，就会创建空间，而不会集中在其他浏览器上

我的目标是：当密码字段集中在IE8上的登录字段时，不应创建空间

请看下面的图片

在此之前，鼠标获得焦点[IE8]

之后，鼠标获得焦点[IE8]

我的html代码如下

<input name="ctl00$logInBox$UserName" type="text" maxlength="256" id="ctl00_logInBox_UserName" class="userName" autocomplete="off" placeholder="Username" />
<input name="ctl00$logInBox$Password_TXT" type="text" maxlength="256" id="ctl00_logInBox_Password_TXT" class="password" autocomplete="off" value="Password" style="display:none" />
<input name="ctl00$logInBox$Password" type="password" maxlength="256" id="ctl00_logInBox_Password" class="password" autocomplete="off" value="" />

---

在：focus上必须有不同的样式，否则不会发生这种情况，进入google chrome open dev tools检查div并单击右侧的小框，该框显示：foc，这将在不聚焦的情况下将项目设置为聚焦，然后检查右侧的所有css，它可能会告诉您原因

---

另外，制作一个提琴，以便我们自己测试它总是有用的

输入的css是什么样子的？我刚刚在回答中添加了css内容尝试将标签放在同一物理行上。浏览器解释空白，包括换行符，不同我记得读到IE8上的内联块可能有问题，有一个修复{*display:inline；}，但不确定只有当字段有焦点时才会有问题。还有，为什么你要在css中声明两个宽度？@Sakthivel请选择一个答案，以便其他人在查看问题时可以知道从何处开始

<script type="text/javascript">
            $(document).ready(function () {
                $('#ctl00_logInBox_Password').hide();

                $('#ctl00_logInBox_Password_TXT').show();

                $('#ctl00_logInBox_Password_TXT').focus(function () {
                    $(this).hide();
                    $('#ctl00_logInBox_Password').show().focus();
                });

                $('#ctl00_logInBox_Password').blur(function () {
                    if ($(this).val() == "") {
                        $(this).hide();
                        $('#ctl00_logInBox_Password_TXT').show();
                    }

                });

            });
</script>

.login .field input.userName, .login .field input.password {
    background: none repeat scroll 0 0 #e9e9e9;
    border: 1px solid #e4e4e4;
    width: 18.3em !important; /*width value changed by sakthivel*/
    display: inline-block;
    line-height: 1.4 !important;
    font-size: 15px !important;
    width: 309px !important;
    padding: 5px 8px 6px !important;
    color: #808080;
}