title: Placing hyperlink in background image
body: <p>I wanted to make the background picture to have clickable links, there will be 3 language selection, when I click into it, it will redirect to respective language page. The problem now is, when I tried resize the browser, the alignment will gone haywire, the area mapping will out of the selection section. Here is the image: <a href="http://imgur.com/fajJXXv" rel="nofollow">http://imgur.com/fajJXXv</a></p>
  
  <pre><code>&lt;html&gt;
  &lt;style&gt;
  body { 
      margin: 0 auto;
      background-color: #000;
  }
  
  .responsive-img {
      width: 100%;
      background-size: 100% 100%;
  }
  
  @media screen and (min-width: 980px) and (max-width: 1024px){
  .responsive-img {
      background: url(&lt;?php echo $imgUrl; ?&gt;images/landing-bg.jpg);
      background-size: 100% 100%;
      background-repeat:no-repeat;
  }   
  }
  
  .outer-wrapper {
      width:100%;
      margin: 0 auto;
  }
  
  .inner-wrapper {
      width:400px;
      margin: 0 auto;
  }
  
  #lang-en {
  background-color: transparent;
  border: 1px solid yellow;
  }
  
  #lang-malay {
  background-color: transparent;
  border: 1px solid yellow; 
  }
  
  #lang-simplified {
  height: 120px;
  width: 90px;
  background-color: transparent;
  border: 1px solid yellow;
  }
  &lt;/style&gt;
  &lt;body&gt;
  &lt;div class="outer-wrapper" &gt;
  &lt;img src="&lt;?php echo $imgUrl; ?&gt;images/landing-bg.jpg" class="responsive-img" style="position: relative; top: 0; left: 0;"&gt;
  &lt;div class="inner-wrapper" style="position: absolute; top: 30%; left: 55%;"&gt;
  &lt;img src="&lt;?php echo $imgUrl; ?&gt;images/blank.gif" width="400px" height="120px" id="lang-en" usemap="#Map" &gt;
  
  &lt;map name="Map" id="Map"&gt;
        &lt;area shape="rect" coords="614,85,676,201"&gt;
        &lt;area shape="rect" coords="260,86,323,202" href="#" id="lang-en"&gt;
        &lt;area shape="rect" coords="26,87,89,202" href="#" id="lang-malay"&gt;
  &lt;/map&gt;
  
  &lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>