Why will this run in Chrome but not in IE?

Posted on 2013-06-29
Last Modified: 2013-06-29
I know very little about HTML and CSS so please show me what to do.

These hot-spots show a border in Chrome and Opera but not in IE.

Can someone show me what to do to make these hot-spots have a border in all popular browsers?

Thank you.

<!DOCTYPE html>

<style type="text/css">
    dl.image_map {display:block; width:313px; height:106px; position:absolute; margin:2px auto 2px auto;}
    a.LINK0 {left:13px; top:55px; background:transparent;}
    a.LINK0 {display:block; width:125px; height:0; padding-top:19px; overflow:hidden; position:absolute;}
    a.LINK0:hover {background:transparent; border:1px dashed black; color:black;}
    a.LINK1 {left:173px; top:35px; background:transparent;}
    a.LINK1 {display:block; width:135px; height:0; padding-top:19px; overflow:hidden; position:absolute;}
    a.LINK1:hover {background:transparent; border:1px dashed black; color:black;}
    a.LINK2 {left:173px; top:75px; background:transparent;}
    a.LINK2 {display:block; width:135px; height:0; padding-top:19px; overflow:hidden; position:absolute;}
    a.LINK2:hover {background:transparent; border:1px dashed black; color:black;}

<body style="font-family: Verdana">
<blockquote style="margin-right: 0px" dir="ltr">

<dl class="image_map">
	<dd><a class="LINK0" ></a></dd>
	<dd><a class="LINK1" ></a></dd>
	<dd><a class="LINK2" ></a></dd>

<img alt="" src="HS2.jpg" width="313" height="106" />

<blockquote style="margin-right: 0px" dir="ltr">
  <p>bottom<br /></p></blockquote>

Open in new window

Question by:NDennisV
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 2
  • 2
  • +2
LVL 43

Expert Comment

by:Chris Stanyon
ID: 39286495
What's a hot spot??
LVL 58

Expert Comment

by:Julian Hansen
ID: 39286586
There is a lot wrong with this code. Before trying to make shakey code work it might be better to understand what you are trying to do.

Are you trying to create clickable regions on an image? If so you want to look at image maps rather than the method you are trying now.

Give us an idea of what we are trying to do and we can then suggest the correct method to follow.

Author Comment

ID: 39286669
Yes it says image-map in the code but I remember them as hot-spots. got me started so I assumed it was good/modern code.

There is an image at the bottom of the code.

Like I said I know very little about this.

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

LVL 53

Accepted Solution

COBOLdinosaur earned 500 total points
ID: 39286710
I assumed it was good/modern code

There is no such thing as "modern" for this very old technique.  We don't see hotspots used much anymore; too much of a hassle in a world where "responsive is the order of the day.

The problem with IE might simply be the use of dashed.  IE has always been a little wonky with dashed and dotted (though I thought they had if fixed as of IE8.  Also borders on images have always been done differently in IE.

That said it does not look like you are actually using an imagemap.  Those are just just links overlaid on an image.

If you actually want to use an imagemap then :
might help.


Author Comment

ID: 39286733
Sorry, that link does not help me. I need CSS that works in all browsers.
LVL 83

Expert Comment

by:Dave Baldwin
ID: 39286986
Note that in <a class="LINK0" ></a> , there is no HTML between the tags... which means there is Nothing to click on.  Had this same thing come up two days ago.

Author Comment

ID: 39287027
Thanks David.

This is part of a bigger project and I really need some help and I'm willing to pay.

Are you available?
LVL 83

Expert Comment

by:Dave Baldwin
ID: 39287045
No, I have about 6 projects I'm working on already.

Author Comment

ID: 39287047
Thanks anyways. Anyone you can recommend?
LVL 58

Expert Comment

by:Julian Hansen
ID: 39287074
@NDennisV - I think I know what you want here - can't look at it right now but maybe mail me or post back here next week and we can maybe sort something out.

Author Comment

ID: 39287081
I'll contact you soon - Thanks

Featured Post

[Webinar] How Hackers Steal Your Credentials

Do You Know How Hackers Steal Your Credentials? Join us and Skyport Systems to learn how hackers steal your credentials and why Active Directory must be secure to stop them. Thursday, July 13, 2017 10:00 A.M. PDT

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …
Google currently has a new report that is in beta and coming soon to Webmaster Tool accounts. This Micro Tutorial will highlight new features for Google Webmaster Tools.

628 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question