Question

https://jsfiddle.net/5mkt6ucr/

<div class="pwordCheck">
            <label>Password </label> <input type="password" id="pword" data-placement="right" title="" data-original-title="Password must be more than 6 characters long" class="mytooltip"><br>
            <label>Confirm Password </label>  <input type="password" id="confpword" onkeyup="passwordValidation(); return false;" data-placement="left" title="" data-original-title="Passwords must match" class="mytooltip">
            <span id="themessage" class="themessage"></span><br> 
        </div>

在我的jsfiddle中可以看到，一旦你开始输入密码并确认密码，就会弹出一条消息。但是这条消息将输入字段分流到左侧。我想知道你是如何定位它所以它弹出而不改变领域。我试过做位置：绝对/相对等，并尝试改变宽度，所以我觉得它正在挤压它。无济于事。谁有解决方案？感谢

Answer 1

只需将 #firstform span 的css属性从 relative 更改为绝对如

#firstform span{
    position: absolute;
}

<强>更新

小提琴：https://jsfiddle.net/5mkt6ucr/14/

搜索按钮图像添加属性

.glyphicon-search
{
   position:relative !important;
}

Answer 2

它没有用css解决问题，但也许没问题。我添加了＆＃39;＆lt; br＆gt;＆＃39;

}else if (password1.value == confpword1.value){
        confpword1.style.backgroundColor = gbc;
        themsg.style.backgroundcolor 
        themsg.innerHTML = "<br>Passwords match";
    }else{
        confpword1.style.backgroundColor = bbc;
        themsg.style.color = gc;
        themsg.innerHTML = "<br>Passwords do not match";        
    }

Answer 3

你使用text-align：center;

如果您从text-align:center;移除#firstform，您会发现一切都很好。

以#firstform为中心尝试以下内容：
margin: 0 auto;
或
left:-50%; + margin-left:-(width/50)

请注意，对于这些居中选项，您的元素需要较宽的宽度，因此您无法使用width:100%;。

Answer 4

您的 CSS

#firstform span{
    position: absolute;
}

只需像这样更改 CSS ......

#firstform .themessage{
    position: absolute;
}

Answer 5

无需更改CSS位置代码。你也可以使用这个代码。您的jsfiddle代码已编辑。 Click Here

if(confpword1.value == ''){
        confpword1.style.background = empty;
    }else if (password1.value == ''){
        confpword1.style.background = empty;
    }else if (password1.value == confpword1.value){
        confpword1.style.backgroundColor = gbc;
        themsg.style.backgroundcolor 
        themsg.innerHTML = '<div class="passerror">Passwords match<div>';
}else{
    confpword1.style.backgroundColor = bbc;
    themsg.style.color = gc;
    themsg.innerHTML = '<div class="passerror">Passwords do not match</div>';       
}

如何将HTML元素准确定位在您想要的位置？

5 个答案: