Bootstrap工具提示左下方位置

Question

在我的表单验证中，我使用bootstrap工具提示来显示 错误信息。
我调整了css来改变外观（img 1）

/* Tooltip */
form .tooltip > .tooltip-inner {
    background-color: #843534;
    color: #FFFFFF;
    border: 0px;
    padding: 0 4px;
    font-size: 9px;
    letter-spacing: 0.5px;
}
.tooltip.bottom {
    padding: 0px !important;
    margin-top: -6px !important;
}
/* Tooltip arrow */
form .tooltip.top > .tooltip-arrow,
form .tooltip.bottom > .tooltip-arrow,
form .tooltip.left > .tooltip-arrow,
form .tooltip.right > .tooltip-arrow {
    border: 0px;
}

我会将我的工具提示放在元素的左侧，如图2所示， 但我还没有办法做到这一点。 （左下角不起作用）

Bootply

我该怎么办？ 谢谢

Answer 1

根据你的笔，只需将此css添加到你的CSS

.tooltip.fade.bottom
{
  left:30px !important;
}

我只是使用!important覆盖当前的左侧值，您将获得结果。

Answer 2

请在你的css中添加以下内容：

.tooltip{
     left:20px !important;
}

Answer 3

修改css如下，

form .tooltip > .tooltip-inner {
    background-color: #843534;
    color: #FFFFFF;
    border: 0px;
    padding: 0 0px;
    font-size: 9px;
    letter-spacing: 0.5px;
    margin-left: -352px;
}
.tooltip-inner {
    max-width: 85px;
    text-align: center;
    border-radius: 4px;
}