Archived topic
background url image don't load
3 replies · Started by Paul on February 19, 2015
Hi Tom
I wanted to show a graphic (quote-icn.png) in a blockquote. Here's the CSS code (using custom CSS from jetpack).
blockquote:before, blockquote:after {
content: '';
content: none;
}
#content .single-entry-content blockquote {
background: url(./images/quote-icon.png) no-repeat scroll 0 0 transparent;
font-style: italic;
margin: 10px 20px 10px 0;
padding: 0 0 0 80px;
}
#content .entry-content blockquote {
background: url(./images/quote-icon.png) no-repeat scroll 0 0 transparent;
font-style: italic;
margin: 10px 20px 10px 0;
padding: 0 0 0 80px;
}
First issue:
image can't be found. So i put the code direct into style.css. It worked well. (had to modify stlye.css again after latest theme update, no biggy)
Second issue:
it doesn't work with Safari and now, it doesn't work at all.
Thanks for any idea.
Paul
Hi Paul,
1. I would use a full URL to your icon instead of using a relative path.
2. Give this a try:
blockquote {
background: url(http://yoururl.com/images/quote-icon.png) no-repeat scroll 0 0 transparent;
font-style: italic;
margin: 10px 20px 10px 0;
padding: 0 0 0 80px;
}Dear Tom
thank you very much for your timely response again!
I have to apologize, because the mistake was on my side. Due to your hint I figured out, that I didn't save the icon in the /images folder, but in the /theme/generatepress/images folder. Due to the latest update of your theme, the file was deleted/overridden by that.
Now I have stored that image in the appropriate folder and it works fine! The phenomena of showing the icon or not was because of browser cache respectively of the cachify plugin, i am using.
Again, sorry and take care, Paul
No worries - glad you got it all sorted out :)
