Handling Internet Explorer users
Goals
- Render or redirect to unsupported browser page in IE (example)
- Open the requested URL in Microsoft Edge (if available)
Reasons
Supporting modern browser features in Internet Explorer in terms of
- Javascript is possible using polyfill. However, it increases Javascript file sizes to all users, including those using the latest modern web browsers.
- CSS is impossible. Many libraries ditched IE support in the latest versions.
In general, Tailwind CSS v3.0 is designed for and tested on the latest stable versions of Chrome, Firefox, Edge, and Safari. It does not support any version of IE, including IE 11.
Source: Browser Support, Tailwind CSS v3.0
Internet Explorer is not supported. If you require Internet Explorer support, please use Bootstrap v4.
Source: Browsers and devices, Bootstrap v5.0
Internet Explorer (10+) is only partially supported.
Source: Browser Support, Bulma
Methods
All code examples are client side HTML codes.
Unsupported browser page
- Render the page from the server
- Redirect to the page from the client
<!-- Add to template (e.g. app.html in SvelteKit) --><head>
<script>
// Check if browser is IE using the user agent value
if (/MSIE|Trident/.test(window.navigator.userAgent)) {
// Redirect to an unsupported browser page that supports IE
window.location.href = 'path-to-html-file.html';
}
</script>
</head>
Open link in Microsoft Edge
- Redirect to the page from the client
