html - 在制作工具提示时在另一个跨度内水平居中跨度?

标签 html css tooltip

对于包裹在 span 元素中的给定单词,我试图仅使用纯 CSS 使工具提示出现在悬停时(没有各种工具提示功能,原因是我需要 LaTeX显示在工具提示中)。工具提示本身是其父 span 中的一个 span。目前,当我试图获得右侧的结果时,我得到了一个偏离中心(左侧)的工具提示:

enter image description here

JSFiddle here .我尝试了各种显示组合(内联、表格、 block )与自动 0 边距等,但均未成功。

最佳答案

尝试添加以下 css 属性,让我知道它是如何工作的:

.link-cont:hover .tooltip{

    display: table; 
        left: 10%;

}

您应该能够根据自己的需要进行调整 - 10% 的人似乎在这个特定示例中成功了。

(我已经用上面的内容更新了你的 JS fiddle)

关于html - 在制作工具提示时在另一个跨度内水平居中跨度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26266829/

相关文章:

jquery - 当另一个元素悬停时保持一个元素的悬停

html - 在 Angular2 中对齐 ngForm 内容

javascript - 通过 Javascript 从点击事件中获取文本偏移量?

javascript - 在 div 已经附加到一个 div 之后,将 div 附加到另一个 div

css - 我可以将 CSS 过滤器应用于背景图像吗?

javascript - 如何在 Extjs 中更改 Treepanel 中访问的节点颜色,就像我们在 html 中一样

css - 应该在 Firefox 的 userContent.css 中定义什么命名空间?

angular - 结构指令、位置工具提示

html - 圆 Angular (边界半径)Safari 问题

wpf - 尝试将验证传递给我的自定义工具提示控件