JSFiddle - React, Tailwind, and code Playground
HTML
<div class="wrapper">
<div class="backgrouund">
<div class="homeImage">
<img src="http://christian-schade.eu/test/1/startimage.png" alt="Home" usemap="#homeMap">
</div>
</div>
<map name="homeMap">
<area shape="poly" coords="0,300, 300, 0, 600,300, 300,600" alt="Sun" href="index.htm">
</map>
<h1 id="h01"></h1>
</div>
CSS
html {
margin: 0px 0px 0px 0px;
background-color: #9f9f9f;
}
body {
text-align:center;
}
.wrapper {
margin:auto;
text-align:left;
width: 900px;
}
.backgrouund {
background-image: url('http://christian-schade.eu/test/1/background.jpg');
position: relative;
width: 1089px;
height: 750px;
/*background-attachment: fixed;
background-position: center 0px; */
}
.homeImage {
position: absolute;
left: 318px;
top: 8px;
}