Getting the following error while trying to display image "blocked:other"

Question

Angular 6 ngBootstrap website

(blocked:other)

The better728x90.gif exists in the correct folder, not sure why I'm gettin this error and other 404s on images that do exist.

The following path is correct:

<a href="assets/images/banners/better728x90.gif">
    <img src="assets/images/banners/better728x90.gif" width="728" height="90" class="fit"><br>
</a>

When I check out the img element in the chrome inspector I see this:

img[src="assets/images/banners/better728x90.gif"] {
    display: none !important;
}

When I force all images to display:block with the following, the missing image icon finally shows up.

:host {
  img {
    display: block !important;
  }
}

---

assets/images/banners/better728x90.gif:1 GET http://localhost:4200/assets/images/banners/better728x90.gif net::ERR_BLOCKED_BY_CLIENT

Answer 1

AH! It was my adBlocker!

I am getting Failed to load resource: net::ERR_BLOCKED_BY_CLIENT with Google chrome

I paused it on my local host and now the images are showing up.