JSFiddle - React, Tailwind, and code Playground

by Netsurfer

HTML

<div>
    <p class="MsoNormal"><img width="2112" height="1457" id="Grafik 1" src="bg.jpg"></p>
</div>
<div id="box0">
    <a href="#"><img width="50" height="50" src="i1.png"><span>erste Zeile</br>zweite Zeile</span></a>
</div>
<div id="box1">
    <a href="#"><img width="50" height="50" src="i2.png"><h1 style="color:black">Willkommen!</h1></a>
</div>

CSS

#box0 {position:absolute; top:50px; left:50px; z-index:1;}
#box0 a:hover {color:black;}
#box0 a span {display:inline;}
#box0 a:hover span {color:black; background:#ffffff; font:normal 14px courier, sans-serif; display:block; padding:5px;}

#box1 {position:absolute; top:100px; left:100px; z-index:2;}
#box1 a:hover {color:black;}
#box1 a span {display:inline;}
#box1 a:hover span {color:black; background:#ffffff; font:normal 14px courier, sans-serif; display:block; padding:5px;}