Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1463
  • Last Modified:

IE9 hover image not working for DIV

We have the following

1) an HTML file
2) a CSS file
3) two image files, one blueish, one orangeish. See attached code.

Works in every browser except IE9

What on EARTH is going ON?

 
CSS:

div.menubutton
{
   background-image          : url('WebMenuWithBorderBG.png');
   height                    : 30px;
   width                     : 150px;
}

div.menubutton:hover
{
   background-image          : url('WebMenuWithBorderHoverBG.png');
   height                    : 30px;
   width                     : 150px;
}

Open in new window

HTML:

<html>
<head>
  <link href="WTF.css" rel="stylesheet" type="text/css">
</head>
<body>

  <div id="M_Tasks" class="menubutton"></div>

</body>
</html>

Open in new window

0
WernerVonBraun
Asked:
WernerVonBraun
  • 5
1 Solution
 
WernerVonBraunAuthor Commented:
Blue Image Blue Image
0
 
WernerVonBraunAuthor Commented:
Orange Image Orange Image
0
 
WernerVonBraunAuthor Commented:
0
 
WernerVonBraunAuthor Commented:
Never mind, peeps. I found that adding a <!DOCTYPE tag to the top of the page solved the problem. It doesn't even matter which one you add; you could add this one:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
or this one:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

It both works.

[shrug]
0
 
WernerVonBraunAuthor Commented:
There you have it folks. Zee internets exploder iz ebil
0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

  • 5
Tackle projects and never again get stuck behind a technical roadblock.
Join Now