CSS Rollover image not working

My apologies.

HTML for header Nav:
https://pastebin.com/S7d5LrEh

CSS Rollover:
https://pastebin.com/H1X4scf2

I hope this is what you are looking for.

Thanks,

Clint

Don’t edit the Twenty Ten theme. Your changes will be over-written the next time you upgrade WordPress or the theme. For this reason, it is recommended that you consider creating a child theme for your customisations.

Ditto what esmi said. Also, try appending !important after the CSS you want to work. I find that usually solves the problem.

for example:

#someelement:hover {
background-color:orange !important;
}

this code will make the background color of ‘some element’ orange no matter what other CSS is in the way. Hopefully that helps.

I completely understand but I do not plan to update the user side as we only need it for a very limited use which is to show a news feed on the news page and in a few other pages.

Thank you hugesuccess, however that did not work. ??

https://pastebin.com/9K3bCdr9

Another added note, this only seems to be effected in IE. It works just fine in FireFox, Safari, Opera and Chrome.

Any other ideas

If you do not keep WordPress up to date, you face a very real risk of your site being hacked.

You give a very valid point and this makes logical sense and gives a very appealing argument. However, if I were to create the child theme, which I probably will now and reset the original twenty ten files, it still does not help with the issue that I posted. Even when I do create the child theme, I am still going to be having problems with the CSS rollover images that only do not work in IE. Could you please offer me assistance with that?

thank you for your patience,

Clint

Hey Clint. Maybe look into adding that functionality with jQuery?

Replaced original twentyten files and created child theme. now i not only have the same css image swap problem, but now the site is not aligned correctly. it seems that IE is now giving it a 2px top and left border yet I cannot find why in the css. can you help with this too?

my css
WP css

header
index
footer

Thanks for your patients,

Clint

scratch that, it is not adding a 2px border, it is actually removing part of the browser and floating to the left about 5-8px and up about 2px. If you switch screens with https://blakemantrans.com/main_template.php, you will see the difference that it is actually removing part of the browser or that is at least what it looks like.

Make sense?

Thanks,

Clint

Can anyone help me with telling me why in IE it is removing the browser border?

Shows correct:
https://blakemantrans.com/main_template.php

shows INcorrect:
https://blakemantrans.com/news/

Everything in regards to the layout was correct when I had modified the twentyten theme, but when I did what y’all said and created a child theme, it is now not rendering properly by removing the browser border. any ideas?

Thanks,

Clint

I really wish someone could help me here. I am now using jQuery for my rollover images and they work fine, even in IE on my regular .php pages, but they still do not work in IE on the WP pages. Can anyone help me with this please?

Shows correctly:
https://blakemantrans.com/main_template.php

Shows incorrectly:
https://blakemantrans.com/news/

jQuery snippet:

$(".link1").hover(function(){
  $(".link1").css("background-position","0px -76px");
  },function(){
  $(".link1").css("background-position","0px 0px");
  });
  $(".link1").mousedown(function(){
    $(".link1").css("background-position","0px -152px");
  });
  $(".link1").mouseout(function(){
    $(".link1").die();
  });

Thanks,

Clint