I inserted an image but it does not appear.
You inserted an image where? And how?
I inserted the image in my custom style.css. It worked on my local BitNami Server. Online it does not work.
Code:
#access .sautericon a {
background:url(‘http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s.jpg’) no-repeat 0.5em 0.5em #0064ae;
}
#access .sautericon a {
padding:0 1.2125em 0 2.8em;
}
#access .sautericon a:hover, #access .sautericon a:focus {
background:url(‘http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s_inv.jpg’) no-repeat 0.5em 0.5em #ffffff;
}
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Doesn’t look like there’s a class named, “sautericon” in your menu.
Where are you trying to add this image to in your theme?
I am trying to add the image to my menu…
I am trying to add the image to my menu…
where exactly?
on any of the menu items?
or as a full menu background?
or on the left/right of the menu?
in any case, right now, the linked web page does not have the css class .sautericon anywhere.
Try this:
#access ul li a {
background:url('http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s.jpg') no-repeat 0.5em 0.5em #0064ae;
}
#access ul li a:hover, #access ul li a:focus {
background:url('http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s_inv.jpg') no-repeat 0.5em 0.5em #ffffff;
}
As Andrew said, there’s no class named, “sautericon” in your menu.
I would like to put the little image to every menu item.
Where will the css class “sautericon” be defined? In my style.css? What will be the code?
Thanks for help!
Do you understand how CSS works? Have you tried implementing WPyogi’s suggestion?
I am trying very hard to understand css.
Yes, I tried WPyogi’s suggestion. It worked very well. The image appeared! Wow!
What will be my approach to find the right position of the image? It shall be at the beginning of each menu item.
You guys are great. This forum is really helpful. Thanks.
How much CSS do you know? Have you tried using resources like:
CSS Tutorials
Learning CSS
Yes. I am a newbie and set up this whole website.
But at some points I cannot figure out how to approach my aim. E.g. positioning my little menu image…
Try chaninging the above to this:
#access ul li {
background:url('http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s.jpg') no-repeat 0.5em 0.5em #0064ae;
}
#access ul li:hover, #access ul li:focus {
background:url('http://apotheke-sauter.de/wp-content/uploads/2013/04/logo_sauter-s_inv.jpg') no-repeat 0.5em 0.5em #ffffff;
}
And then add:
#access a {
margin-left: 30px;
}
And yes, as esmi has mentioned, you do need to learn some CSS to make changes like this to your site :)!
I am learning every day 🙂
Thanks! And good night!
