Javascript 引导工具提示，如何使用固定对齐？

我正试图在主题上实现什么，所以有一个固定宽度的工具提示，并根据我的相对父母正确对齐。我不理解逻辑，如果我将min width设置为100%，宽度看起来像父div的50%，如果我更改它，我会得到两个不希望出现的行为：

1） 工具提示在父div之外（在我的例子中是右侧）

2） 如果我更改工具提示类的绝对位置（不是内部位置），我可以获得我想要的，但是工具提示箭头元素不再正确对齐（尝试更改类工具提示箭头的位置，但没有成功，即使使用正确的值！important！）

你有什么建议或最佳实践吗？这是我的

---

只需将其添加到CSS中。您没有设置工具提示的宽度和位置

.tooltip{
  width:100%;
  left:0 !important;
  right:0  !important;
}

如果你想要正确的对齐方式，添加这个

  .tooltip{
     width:100%;
     right:100%  !important;
  }

右对齐的JS

$('i[data-toggle="tooltip"]').tooltip({
    animated: 'fade',
    placement: 'right'
});

---

只需在jquery中设置

placement:“right”

，而不是

placement:“top”

：谢谢穆罕默德，这非常有帮助……而且是我想要的精确对齐方式！但是现在我有一个未对齐的箭头（在我的I元素顶部），你可以在图标上添加一些边距，或者尝试添加一些正确的填充。col customNo我指的是箭头，我将你的提示应用到这个新的小提琴上，我现在无法对齐箭头->任何想法？添加这个，你就完成了：）。工具提示箭头{右：7px！重要；左：自动！重要；}你是天使：-）

  .tooltip{
     width:100%;
     right:100%  !important;
  }

$('i[data-toggle="tooltip"]').tooltip({
    animated: 'fade',
    placement: 'right'
});