newcoder1010 Posted April 27, 2017 Share Posted April 27, 2017 Hello, HTML: <ul class="SocialMediaMenu list-inline"><li class="fb first leaf"> <a href="https://www.facebook.com/p" title="facebook" target="_blank">f</a></li> <li class="tw last leaf"><a href="https://twitter.com/P" title="twitter" target="_blank">t</a></li> </ul> I have this css to replace the a link by an image. Color is transparent. After I have the background image, I dont see the list items. They just disappear. .SocialMediaMenu a { display: block; height: 40px; line-height: 40px; width: 40px; border-radius: 30px; color: transparent; text-align: center; /* font-size: 2em; */ float: left; border: 0; margin: 10px; background-image: url("/DAVIS%20LOGO_0.png"); } Please advise. Link to comment Share on other sites More sharing options...
Ingolme Posted April 28, 2017 Share Posted April 28, 2017 Have you verified that the image was loaded? Open the developer tools (Pressing F12 on the keyboard) and make sure that "DAVIS LOGO_0.png" is getting a 200 status in the network tab. Link to comment Share on other sites More sharing options...
dsonesuk Posted April 28, 2017 Share Posted April 28, 2017 If you inspect the anchor, it will show background-image styling showing link to image, if you hover over that link it will show the image, OR failed to load error message. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now