Icons (.png) not showing up on Internet Explorer & Firefox

[quadinfotech]

Embedded icons placed with CSS aren’t showing up on Internet Explorer & Firefox. Worked perfectly with Safari and Chrome.
Can someone please let me know what is causing this and how to fix it?

This is the website: www.quadinfotech.com

Thank you in advance!

[Alaa]

Hi @quadinfotech

Please check this screenshot I captured from Firefox:

As you can see the first icon is loading fine, however the others not. The reason behind this issue is that you have entered the correct CSS code needed for the first icon in the correct place in (Theme Options > CSS):

.genealogy:before{margin-left:30px;padding-top:10px;content:url(http://quadinfotech.com/wp-content/uploads/2018/08/GENEALOGY.png);width:70px;}

First, you gave a custom class name for the li, then added the correct code mentioned above, simply you need to do that with all other icons, because what you have done on the other icons isn’t correct, I mean adding just the CSS code to the li, without targeting the pseudo element :before isn’t correct.

Thanks.

[quadinfotech]

Hi Alaa,

I noticed that, but couldn’t figure it out why that icon appeared and not the others. Because I tried implementing the same code with the others and nothing happened…

Will go with your advice and see if it works.

Thank you so much!

[basanta]

Let us know the result!

Thanks

[quadinfotech]

Hi Basanta,

It worked flawlessly! Thank you!!

[friech]

We are delighted to assist you with this.

Cheers!