将子div放在父div之外

Question

我有一个在鼠标悬停时有工具提示的表，我想在父div外面显示20px x 20px

因此，例如，如果该单元格位于表格的左上角四分之一，则其顶部工具提示会出现在该单元格底部下方20 px处，而右侧右侧则是20 px，这很不错，但是我无法弄清楚如何制作其余的工作正常，如何在div的上方或左侧进行操作，例如，如何使div的右下角不溢出页面的外部。

我尝试过：

.HeatMapTooltip.rightHM.topHM{
  right:-115px;
  margin-bottom:-118px;
}

但没有成功

此图片是我桌子四分之三的一个例子。

先谢谢您

https://jsfiddle.net/vnLxe23b/2/

Answer 1

您要使用margin-left和margin-top而不是right和bottom。

以下内容应覆盖您现有的规则：

.HeatMapTooltip.rightHM.topHM {
  margin-left: -154px;
  margin-top: 20px;
}

.HeatMapTooltip.leftHM.bottomHM {
  margin-left: 20px;
  margin-top: -114px;
}

.HeatMapTooltip.rightHM.bottomHM {
  margin-left: -154px;
  margin-top: -65px;
}

可以在here上看到它。

您可能需要调整值以适合。