jquery - 无法对齐 UI 工具提示中的部分文本？

Question

我有一个包含多行数据的 Jquery UI 工具提示。每行都有 2 条独立的信息，我想分别对齐它们以很好地格式化。左侧的名称我想左对齐，而与名称关联的数据我想右对齐。

我试过各种对齐方式，都没有成功。

我读到我可以使用 ui-tooltip-content css 类 https://api.jqueryui.com/tooltip/#option-classes

操纵内容，如果我操纵整个内容本身，它会成功；但是我正在尝试在内容中操作 span 标签。

通过做

  .ui-tooltip-content .right
  {

      color:blue;
  }

我成功地只能将那个文本更改为蓝色；但是如果我尝试

 text-align: end;
  text-align-last: end;
  align-content: flex-end;
  align-items: flex-end;
  align-self: flex-end;

(我尝试了“right”、“flex-end”和“end”)。

它们似乎都不起作用

我很好奇是否有人知道如何正确对齐我的文本以便我不会遇到问题？实际上，我可以为主要内容保留默认的 text-align: left;，但我只需要了解如何右对齐文本的右侧部分。

谢谢你的帮助

Answer 1

尝试添加以下 CSS:

.ui-tooltip-content .right { 
  float:right; 
  color:blue; 
  text-align:right 
}