Redirect for Browser APP

I have made a Website for a Client. Since I used some flexbox and Grid the site is not completely IE compatible. Even though there are very few users that still use IE, my client persists on having the compatibility. I would like to know if there is a way to redirect IE users to another site which would be bare bones information. Or even just an even a notification that their browser is outdated.

Thanks in advance, any help would be appreciated.

I found this. it might help

This solution requires a new file, which i am unable to do with webflow hosting.

I also looked into those options:

<!--[if IE]>
<script type="text/javascript">
window.location = "http://www.google.com/";
</script>
<![endif]-->
<!--[if IE]>
<meta HTTP-EQUIV="REFRESH" content="0; url=http://www.google.com">
<![endif]-->

Both of which are not working for me. :frowning:

So a redirect for users using IE10 and IE11 as well as older browsers that do not support grid:auto is possible. Its not a bad solution as you can then create a simple landing page with basic info on how to contact you and other things. You will need to test for browser support of IE10 and 11. This can be done with what is known as a browser hack. Browser Strangeness - Jeff Clayton's CSS Hack Test Page
You want the one for IE10 and IE11. @media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) { .selector { property:value; } }
You will replace the .selector with a class, tag or whatever…I use (body {display:none;})
Next you will check also for other browsers that do not support grid:auto
Use @supports not (display: grid) {
body {
display: none;
}
}
Save the css and add to your project. Then you will need some jquery to test for body display:none and the redirect.

var el = document.querySelector(‘body’);
if (window.getComputedStyle(el,null).getPropertyValue(“display”) == ‘none’) {
setTimeout(function(){
window.location = ‘https://thenewredirect.html’;
}, 5000);
}
Obviously if you want to take this one step further you could forget the redirect and load replacement html from another page by id to replace only sections using css grid. Thats what I do…

Good Luck !

T

First of all, thank you a lot for that thorough answer. I will look into all of this and get accustomed to your solution. Does this approach work with webflow hosting?.

I have not tested it but Webflow does allow custom.css and custom.js correct ?

Yes they do if you have a payment plan.