title: Is it possible to style a mouseover on an image map using CSS?
body: <p>I have an image on a web page that also requires links. I am using an image map to create the links and I am wondering if there is a way to style the area shape on mouseover for a minor touch of interactivity. Is this possible?</p>
  
  <p>I tried this without success:</p>
  
  <p>html</p>
  
  <pre><code>&lt;img src="{main_photo}" alt="locations map"  usemap="#location-map" /&gt;
  &lt;map name="location-map"&gt;
      &lt;area shape="rect" coords="208,230,290,245" href="{site_url}locations/grand_bay_al" /&gt;
      &lt;area shape="rect" coords="307,214,364,226" href="{site_url}locations/mobile_al" /&gt;
      &lt;area shape="rect" coords="317,276,375,290" href="{site_url}locations/loxley_al" /&gt;
  &lt;/map&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>area { border: 1px solid #d5d5d5; }
  </code></pre>
  
  <p>Any suggestions?</p>