Tasty Menu Icons not showing - How to

#1

Hi,
I am messing around for hours to get working custom icons for the menu section on my page.

Link

https://www.heuriger-dreimaederlhaus.com/

I tried a lot of things in Custom CSS, but I don’t get it. In html it shows:

img src="none"

When I change the src to the correct URL of my Icons, the Icons appear. But I am not able to make that constantly working with CSS.

I tried things like:
div.menu-group-header:nth-child(1) > img:nth-child(1) { src: url("http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png"); }

and other CSS Selectors, but somewhere I am wrong. I guess src: url() is the problem, but I can not figure out how to get it right.

Could you please give me a hint or solution? I would appreciate it really.

Thank you very much.

Anmerkung%202019-12-02%20171812
Anmerkung 2019-12-02 171812.png1483×247 25.4 KB
Anmerkung%202019-12-02%20171813
Anmerkung 2019-12-02 171813.png277×780 21.8 KB
Anmerkung%202019-12-02%20172300
Anmerkung 2019-12-02 172300.png1495×195 25.9 KB

#2

Hi there,

Actually you already know the answer. The CSS code like this will not work.

div.menu-group-header:nth-child(1) > img:nth-child(1) { 
   src: url("http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png"); 
}

Instead, please do the same as your uploaded image, e.g:

<img src="http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">

Regards,

#3

Thanks for your reply.
Still, I don’t get it working. Maybe, if you don’t mind could you please post the full code snippet for me?
I tried the following in different manners:

div.menu-group-header:nth-child(1) > img:nth-child(1) {
<img src="https://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">

}

The selector should be right, as if I change

background: anycolor;

it works fine.

The initial question is, why does not show up the correct icon and URL after uploading it? Instead it shows src=“none”? How do I get rid of that problem? Any idea?

#4

Hi,

I am sorry, that’s not what I mean to merge the CSS code + HTML code:

div.menu-group-header:nth-child(1) > img:nth-child(1) {
<img src="https://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">
}

Is the upload-image as your last screenshot didn’t work?

If not, is it okay if you create a temporary login detail and send it to me through a private message?
Let me try to check it directly