JSFiddle - React, Tailwind, and code Playground

by wizztjh

HTML

<div id="imap">
    <img id="canvas" src='http://2.bp.blogspot.com/_lrTLZntIlyw/TG8IJHRcXBI/AAAAAAAAAwU/ZWP7Ws6hhMA/s1600/okinawa_churaumi_aquarium_04_45.jpg'/>
    <dl id="fishmap">
        <dd id="fish-note-1-def" class='fish-note-def'>
            <a href="#">
                <div class='fish-note-content'>
                <h3>This is a shark</h3>
                <p>wow</p>
                </div>
            </a>
        </dd>
    </dl>
</div>

CSS

#imap{
    width: 700px;
}
#canvas{
    width: 100%;
}

#fishmap div.fish-note-content{ display: none; }

#fishmap{
    position: absolute;
    top: 0;
    left: 0;
}