Jump to content

IE8 background image hover bug


inactive

Recommended Posts

Hey guys,

I may have found a new bug in IE8, googled around a bit but can't find anything close...maybe someone here knows whats going on?

 

Anyway, basically just a div with background colour, and inside sits a block displayed link, transparent in its normal state, but with a background image when hovered over.

 

Test case at http://esquimaux.com.au/ie8bgtest/test.html

 

So the HTML is like this (bare in mind the actual case is valid XHTML 1.1):

<body>

	<div id="outer">
		<a href="#" id="inner">test</a>
	</div>

</body>

 

And the CSS as follows:

div#outer { width: 100px; height: 100px; background-color: #00FF00; }
a#inner { display: block; width: 100px; height: 100px; background: transparent; }
a#inner:hover { background: transparent url(testbg.png); }

 

So its meant to just be a green square with the test link in it, and as you hover over it the backgroun image kicks in and the sits over the whole div, so the whole square goes blue (as thats the colour of the bg image).

 

Works great in all good browsers, even IE6 and 7, but not IE8 (curiously though it does work in IE8 compatibility mode).

 

In IE8 the bg image doesnt show. Any other hover css will work (changing link colour etc). Also, it will work if the initial link css doesnt have background: transparent set, but i need that tag for the site im working on.

 

So it seems the IE8 can't overide the background: transparent on hover state.

 

Any ideas?

Link to comment
Share on other sites

As long as those are fixed before the program is released i wouldn't care about the amount of bugs in any software.

 

I used to test my sites in IE8 Beta as well, and i generally found that they worked the same as in IE7, i even tested out the new webslices. I can only say that IE has improved a lot, it would however still need to add some functionality, such as the possibility for its users to change default hotkeys, I.e. Usability issue: backspace key

 

 

If you are validating your code and testing new features in IE, then it wouldn't take long for you to notice how the hslice class was referenced to have an ID like "1", that would generate validation errors since ids ain't allowed to begin with a number. As far as i know, it doesn't however make much a difference to name the hslice "item-1" or similar, (which is allowed). So some stuff are really easily solved.

 

You may want to check out Report a Webpage Problem Internet Explorer 8.0 Beta Add-On

Link to comment
Share on other sites

  • 1 year later...
  • 4 years later...
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.