css - テキストの絶対リストの作成

Question

私のウェブサイトには、次のようなテキストのリストがあります。

私の目標は、ユーザーがこれらのテキストのいずれかにカーソルを合わせると、そのテキストに関連する画像がポップアップすることです。このようなもの：

しかし、代わりに、テキスト間にスペースを作成する次のようなものが得られます。

Answer 1

たとえば、相対位置と絶対位置を使用するだけです。

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

Answer 2

position:absoluteimage 要素を使用すると、これが発生しなくなります。

Answer 3

リスト項目をposition: relativeに、画像を に設定しますposition: absolute。次に、必要に応じて配置します。(例: のようなものtop: 0; left: 100%;)