Hello Shashidhar,

I have been looking into your question and what I can say is that it is possible to use CSS class rules to achieve the same result.

For example:

.custom_class {
    width: 32px;
    height: 32px;
    background-image: url(layout_header.png);
}

$("#grid").igGrid({
    …
    columns: [
        {
            headerText: "<div class='custom_class'></div>",
            key: "ProductID",
            dataType: "number",
            width: "15%",
        },
        …
    ]
});

Please test it on your side and let me know if you need any further information on the matter.

Sincerely,
Riva Ivanova
Software Developer

can we do this via css style

.Img_HighRisk {
background-image: url("../../Images/Grid_Icons/HighRiskOn.gif");
background-repeat: no-repeat;
background-position: center;
}

Thanks for the response!

Using a <div> instead of a <span> tag did not resolve the problem for me- I was still witnessing the same behavior as I was before.

At this point, the users have decided they don't want this after all, so we don't need to pursue further at this point regardless.  Thank you!