CSS image links trouble

Hi all.

I was wondering if anyone can help me out with some image css links i have been working on.

The buttons seem to work fine in FF but they dont load correctly in IE 7.

Please visit my site by clicking here (http://ginterface.com/avanti/) to see what i mean.

The problem is with the buttons on the right.

I would suggest you view the site in FF first so you can see how it is supposed to work.

The css code for the hover image links is as follows:

.rolloveravanti a {
display:block;
width: 230px;
height:51px;
background: url("img/banner_navigation_07.jpg") 0 0 no-repeat;
}
.rolloveravanti a:hover {
background-position: 0 -35px;
background: url("img/images_07.jpg") 0 0 no-repeat;
color: #049;
}
.rolloveravanti a:active {
background-position: 0 -70px;
color:#fff;
}

If anyone can shed some light on this matter I would be very greatful as it has been causing me major trouble!

Cheers :D

Hello xdous,
Your going to have to be more specific when explaining the problem. I see no difference between IE7 and FF2.

I can show you a CSS rollover that won't flicker like yours does. Your method has to download the hover image when you mouseover the link.
This method (http://nopeople.com/CSS/CSS_rollover/) has button and the hover image all in one.

Thanks for your example.

I have tried to amend my code but this does not work for some reason. I am guessing i am doin something wrong.

I have tried copying your code and amending it with my images and sizes but it does not work :(

I see the problem, and it isn't your images. I THINK it's because you have that element floating to the right. Try replacing your sidebar style with this:
#sidebar
{ width:215px;
padding:10px;
margin-left:15px;
float:left;
font-size:80%;
}
And follow the advice of Excavator about the image rollover. It wasn't intended to fix your problem, or at least not the one you were asking us to fix. It's merely a trick that combines your link image and rollover link image into one. This prevents the lag-time the image causes when someone hovers over a link for the first time (which is caused because the image has to load).

Thank you for your response Majoracle but this still does not seem to fix the problem is there any other tips. I hate IE its the worst!!

Your site looks the same to me in FF2 and IE7. I would certainly implement the pixy technique suggested by excavator for the rollovers. It will prevent the delay when you first hover over a button.

John