Images in IE 8 are not showing up

Question

I'm having trouble getting the let hand side tabs here to show up properly in IE 8:

They haven't been showing up since I added the "New" image and I can't seem to figure out what's up. They show up fine in all other browsers that I've seen.

Any suggestions?

score 1 · Accepted Answer · answered Oct 28 '11 at 14:49

1

Use position:absolute, not relative in this decclaration. You'll need to set top: and left: as well.

.deal-tabs .tab .innerShadow .new {
  background: url("resource/new.png") no-repeat scroll 0 0 transparent;
  height: 24px;
  left: -6px;
  position: relative;
  top: -8px;
  width: 34px;
}

answered Oct 28 '11 at 14:49

Diodeus - James MacFarlane

112,730
33
157
176

I didn't really want to have to specify the absolute position for `.new` though.... is there another way? – Ben Oct 28 '11 at 14:58
Not really. It's the only way to dependably overlap two images. – Diodeus - James MacFarlane Oct 28 '11 at 15:12
When I make the position relative of the innerShadow it becomes visible on top of the white area on the right side, instead of behind it as it currently is. This happens despite me giving it a z-index of 1 – Ben Oct 28 '11 at 16:09
What is the z-index of its parent? – Diodeus - James MacFarlane Oct 28 '11 at 16:42
by giving "it" a z-index of 1, I'm referring to the `.innerShadow`. It's parent has no specified z-index, but the element I need on top of it has a z-index of 2. – Ben Oct 28 '11 at 17:01

Images in IE 8 are not showing up

1 Answers1