How to restore to the smaller size of image control visible at designer?

Question

All of sudden, few hours ago, I started to have a weird problem in all sites of my Sharepoint Server 2010 dev machine.

In any of old and new, built-in and custom WebPart pages of list views, whenever I add "Inline Editing" ("List View Tool" section in ribbon --> "Inline Editing") to a web part and click in Design mode (trying to access properties of "Inline Editing") green cross image control, I observe very lengthy vertical frame of an image:

Right ckicking and choosing "Picture Properties..." shows

• /_layouts/images/fgimg.png
• Width: 96
• Height 712

Browsing to this relative location of any my SP2010 site and subsite of website collection:

• http:///_layouts/images/fgimg.png
• http:////_layouts/images/fgimg.png
• http:////_layouts/images/fgimg.png
• http://///_layouts/images/fgimg.png
• etc. renders the image below

I am not sure but I believe this happened after I installed the subsubsite from downloadable for book "Microsoft® SharePoint® Designer 2010 Step by Step" .wsp solution.

Though only image of small green cross is shown at run time,
it is jumpy to deal with and I believe I did not have such huge image for small green cross before.
How can I revert the situation to small image ?

Answer 1

The image you mentioned is used across all of the SharePoint v4.master (and not only). The important aspect is that only a small part of this image is ever displayed by using either OffSet properties in server side controls or CSS background-position attributes.

One reason for which you see that it might be because it is referenced in any controls on your page without proper use of the offSet or CSS properties. I would go in search for any control or web part that are referencing it :

• in SharePoint Designer - check for Offset
• in Internet Explorer use developer tools to see which HTML element is referencing it (F12 - or IE Developer Tools).