I have a problem that has just recently occurred, it may be a browser bug in Edge as I am sure it was working previously, but I have some .jpg images that are not showing in Edge (but show fine in IE, Chrome, Firefox) instead all I see is a color (different color for different image - even though there is no background color or any other color attributed - so should be white if image not showing - these images are using styles of radius and shadow, but removing them makes no difference.
When I right click and save image the correct jpg is downloaded, the link is good, as I say it works on other browsers, but no longer on edge (nothings changed that I know of). Any ideas?
as seen on Edge:
As seen on other browsers:
I have tried removing styles and checked the divs for overlaps or other common problems, everything looks OK.
.sitelinks { margin: 10px 42px 10px 45px; padding: 20px 5px 20px 5px; width: 180px; vertical-align: top; display: inline-block; } .sitelinks:hover { background: #CCC; } .sitelinks img { width: 1px; height: 1px; box-shadow: 3px 5px 12px #000000; border-radius: 50%; } .sitelinks img:hover { -o-transform: scale(1.06); -webkit-transform: scale(1.06); -ms-transform: scale(1.06); -moz-transform: scale(1.06); transform: scale(1.06); } .desc { padding-left: 10px; padding-top: 10px; width: 160px; text-align: center; font-size: 1.4em; color: #333; font-family: 'Quicksand', sans-serif; font-weight: 600; } <div class="sitelinks"> <a href="services.php" target="_self"><img id="link1" src="assets/img/services_ico.jpg" alt="Our Services"></a> <div class="desc"><a href="services.php" target="_self">Our Services</a> </div> </div> <div class="sitelinks"> <a href="contact.php" target="_self"><img id="link2" src="assets/img/contact_ico.jpg" alt="Contact the team"></a> <div class="desc"><a href="contact.php" target="_self">Contact Us</a></div> </div> <div class="sitelinks"> <a href="photos.php" target="_self"><img id="link3" src="assets/img/gallery_ico.jpg" alt="Picture Gallery"></a> <div class="desc"><a href="photos.php" target="_self">Photo gallery</a> </div> </div> <div class="sitelinks"> <a href="reviews.php" target="_self"><img id="link4" src="assets/img/feedback_ico.jpg" alt="Customer reviews"></a> <div class="desc"><a href="reviews.php" target="_self">Customer testimonials and reviews</a></div> </div>
There are four images that are the same html
#javascript #html #css #image