Css:
.woocommerce-placeholder.wp-post-image {
content: url("DSC0926-1.jpg");
}
/*for firefox*/
.woocommerce-placeholder.wp-post-image::before {
content: url("DSC0926-1.jpg");
}
HTML
<img src="placeholder.png" alt="Placeholder" class="woocommerce-placeholder wp-post-image" scale="0" width="100" height="100">
I have been attempting to update the placeholder image using CSS. Although it is successful in Chrome and Safari, the ::before workaround I applied for Firefox appears to be ineffective. What could be causing this discrepancy?
P.S. Despite exploring various solutions such as using :after and modifying
content: ''; background: url('DSC0926-1.jpg');