制作绝对文本列表

Question

我的网站上有一个文本列表，如下所示：

我的目标是，如果用户将其中一个文本悬停，则会弹出与悬停在其上的文本相关的图像。像这样：

但相反，我得到的东西会在文本之间创建一些空格：

Answer 1

在image元素上使用position:absolute可以阻止这种情况发生。

Answer 2

将您的列表项设置为position: relative，将图片设置为position: absolute。然后根据需要定位。 （例如top: 0; left: 100%;）

Answer 3

只需使用position relative和absolute，例如：

li { position : relative; }
li img { position: absolute; top: 0; left: 100%; }