css - 在 bootstrap 工具提示上对齐 div

标签 css twitter-bootstrap jquery-ui-tooltip

我为 HTML View 页面生成了代码,以针对表格中的每一列显示 BS 工具提示。 Tool Tip的内容,也是类似表格的结构。我使用 div 制作它,但在 div 上有很长的内容没有像表格一样正确对齐

你能帮我纠正这个变化吗?

严重级别是第二行,严重级别对应的值是长的。我需要将严重级别与相应值的开头对齐

enter image description here

HTML(通过 rails 模板生成)

<div data-toggle="tooltip" data-placement="right" data-html="true" title="" data-animation="true" data-original-title="
<div style = 'width:200px,'>
   <div class ='tool-tip-cells'>Repair Method </div>
   <div class ='tool-tip-cells'> Repaint </div><div class ='tool-tip-cells'>Severity Level</div>
   <div class ='tool-tip-cells'>Damage 2.5cm to 7.5cm in length and/or diameter</div>
   <div class ='tool-tip-cells'>Estimate No.</div>
  <div class ='tool-tip-cells'>9176863</div>
<div>">Rear Bumper RHS (Scuffed)</div>

CSS

.tool-tip-cells{
text-align: left;
width: 100px;
display: inline-block;
}

最佳答案

你可以试试这段代码:

vertical-align: text-top;

关于css - 在 bootstrap 工具提示上对齐 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51817320/

相关文章:

javascript - Bootstrap 3 为单个模态设置选项

html - 当内容增加时,我的内容 div 放错了位置

javascript - CSS 工具提示不显示

单击按钮并与其他悬停项目一起显示后,JQuery 工具提示不会消失

css - 图像周围的空白

html - 并排显示三个图像

jquery - 无法更改 Bootstrap 的 css

html - 可嵌入的 HTML/CSS/脚本引擎 C++

html - 在 chrome 的 anchor 标记内只有部分图像是可点击的

css - 在 TinyMCE 中的元素上使用 jQueryUI 工具提示