Troubleshooting website display or functionality issues in Edge on Windows 11
This browser is no longer supported.
Upgrade to Microsoft Edge to take advantage of the latest features, security updates, and technical support.
I run a WordPress site on Hostinger with Cloudflare in front of it. I’m trying to understand an image problem that only happens in Microsoft Edge, and I’d like to learn how to diagnose it properly instead of guessing.
What’s happening The featured image at the top of this page sometimes doesn’t display in Edge: https://towalisoviejo.com/blog/how-to-check-power-steering-fluid/
My setup
What I’ve tried so far
What I want to learn
Troubleshooting website display or functionality issues in Edge on Windows 11
AI answer
Capture the image request in Edge with DevTools cache disabled at both locations, then compare the response body and Cloudflare headers; location-dependent differences in CF-Cache-Status, CF-Ray, Content-Type, or Vary point to CDN variant handling, while identical successful responses point toward an Edge decode or page-rendering issue.
At the failing location:
srcset, or request blocking.Disable cache affects Edge’s browser cache while DevTools is open; it does not bypass Cloudflare’s edge cache. Edge’s Network tool can inspect request headers, response headers, response content, size, Preview, and Timing information.^1^ ^2^
Since hard refresh, cache clearing, InPrivate, extension isolation, and a Cloudflare purge have already been tested, the next useful step is collecting the actual failing response rather than repeating those actions.
Select the .webp request and inspect:
200: a body was returned; continue with headers and Preview.206: verify that the Content-Range is valid and the response contains the expected bytes.304: the response still involved browser cache validation; repeat with Disable cache enabled.4xx/5xx: this is an HTTP/CDN/origin failure, not an image-decoder diagnosis.(blocked:...), ERR_BLOCKED_BY_CLIENT, or no network request: investigate Edge policy, tracking prevention, security software, or request-blocking rules.200.Failed to load resource, HTTP status errors, mixed-content messages, CSP errors, or tracking-prevention messages. The Console can link a failed resource directly to its Network entry.^3^Also open the Network request’s Initiator information. This helps determine whether the image came from the original <img>, lazy-loading code, CSS, or a service worker.
Record the raw request and response headers from both locations:
| Header/value | What a difference suggests |
|---|---|
CF-Ray |
Which Cloudflare data center handled the request |
CF-Cache-Status |
HIT, MISS, or BYPASS behavior at that edge |
Age |
Whether and how long a cached object has been served |
Content-Type |
Must describe the image rather than HTML or another type |
Content-Length |
Different representations or responses; by itself, it does not prove truncation |
Content-Range |
Incorrect or incomplete range response |
Cache-Control |
Whether the object is cacheable |
Vary |
Whether format selection varies by request headers |
Cf-Polished |
Whether Cloudflare Polish processed or skipped the image |
Content-Encoding |
A content-coding/compression difference |
Set-Cookie |
Can affect whether Cloudflare bypasses caching |
Request Accept |
Whether each browser advertises different supported image formats |
Cloudflare caching is local to data centers or cache-tier paths, so one location can return a HIT while another returns a MISS; differing Age values alone are normal.^4^
The stronger evidence is a difference in the body, Content-Type, Content-Range, or format-selection headers. If image optimization or content negotiation is enabled, verify that Vary and Cloudflare’s image-variant configuration prevent representations intended for different browser capabilities from being mixed.^5^ Polish can also be skipped when the origin supplies a non-image content type or non-cacheable response characteristics; inspect Cf-Polished for its status.^6^
Compare actual downloaded payloads where possible. Equal Content-Length values do not guarantee equal or valid files, and different lengths can be legitimate when different encodings or optimized variants are served.
Tracking Prevention: Open the Console, reload, and search for:
Tracking Prevention blocked access to storage for
Also inspect the page-information icon beside the address bar for blocked trackers. For a controlled test only, add a site exception through the page-information flyout or edge://settings/privacy/trackingPreventionExceptions, retest, and then remove the exception. Edge can block classified third-party resource loads, particularly under Strict mode.^7^
Because this image uses the same site hostname, tracking prevention is less likely unless the page redirects it or loads another optimized URL. The Network request’s final URL will reveal that.
Efficiency and sleeping tabs: These are unlikely for an actively viewed page. Edge prevents a visible tab—and a tab currently inspected by DevTools—from sleeping. Adding the site under Settings → System and performance → Performance → Always keep these sites active is therefore only an optional control test, not a likely fix.^8^
Vary, range responses, and origin headers.src, srcset, CSS, lazy loading, service-worker behavior, and Console errors.Export a HAR from each location if escalation is needed. HAR files can contain cookies, authorization data, tokens, query parameters, request bodies, and identifiers. Capture from a signed-out or disposable session where possible, sanitize those fields, and share only through the vendor’s approved secure support channel.
References