奇怪的CSS问题 - 当我在表单中写下内容时，标题会向上移动

Question

奇怪的CSS问题 - 当我在表单中写下内容时，标题会向上移动。

当我点击“登录”并且我开始输入用户名或密码时，此website的标题会向上移动。

我需要保持“登录”表格固定，否则它将隐藏在主要内容之下。

我必须将主要内容保留为“溢出：隐藏”，因为我想在标题上隐藏“蛋”背景图片。

这是一些脚本：

表格：

.tooltip-wrap .corner {
    position:relative;
    z-index:100;
    margin-left:-5px;
    width:0;
    height:0;
    border:5px solid transparent;
    border-bottom-color:#fff;
}

.tooltip-text { 
    float:left;
    margin-left:-50%;
    padding:1em 15px;
    background:#fff;
    color:#333;
}

标题：

.header-wrap {
    position:relative;
    z-index:101;
    background-color:#3d4e5b;
    color:#fff;
    overflow:hidden;
}

.site-header {
    padding:2em 0;
    border:1px solid rgba(255,255,255,0.1);
    border-right-width:0;
    border-left-width:0;
}



.site-header:after {
    bottom:-1px;
}

.site-logo a {
    color:#fff;
    font-size:1.5em;
    padding-left:5em;
    z-index:9;
}

.site-logo h1 {
    margin:0.3em 0 0 0;
}

/*------------------------- Dropdown Menu ------------------------*/

.header-navigation.back {
    z-index:-1;
    position:absolute;
    margin-left:0;
    margin-top:-6px;
    border:none;
display:block; height:137px; width:1171px; padding:0px; outline:none; text-indent:-9999px;
background-image:url('http://frenchegg.com/images/backmenu.png');
}