CSS3 Pie removes background images in

Question

When my page loads in IE (7,8) my background image in the left column li's shows for a split second before CSS3 Pie kicks in, adds the border to the li elements it's meant to and then removes the background image from my list items like this...

http://goo.gl/xCz39

In FF this works if you wanted to see what it is meant to look like. I'd appreciate a work around for this if someone has one. Many thanks!

score 1 · Answer 1 · edited Nov 12 '12 at 13:34

1

Also an absolute image link in your CSS could do the trick in some cases.

Like:

#yourdiv{
    behavior:url(css/PIE.htc);  
    -pie-background:
              url(permalink-here/your-image.png) right no-repeat,
              url(permalink-here/your-image.png) left no-repeat;
}

edited Nov 12 '12 at 13:34

j0k

22,600
28
79
90

answered Nov 12 '12 at 13:12

C. de Zeeuw

11
1

score 0 · Answer 2 · answered Feb 08 '12 at 14:40

I suspect that the problem is this: the element generated by Pie, for the border, has a higher z-index than the original element which has the background image.

Try giving

#content-left ul li a{position:relative;}

Or try another of the solutions suggested here

CSS3 Pie removes background images in

2 Answers2