in my header I have:
<!--[if lte IE 8]>
<meta http-equiv="refresh" content="0; url=/ie-sucks" />
<script type="text/javascript">
/* <![CDATA[ */
window.top.location = '/ie-sucks';
/* ]]> */
</script>
The above code easily redirect the users which are using < IE 8 to another place ie-sucks
So this is working fine, but I just was checking the users, after they redirect to /ie-sucks, they open Mozilla Firefox and again copy paste the mysite.com/ie-sucks into the address bar, so then again they will encounter to that page...
I know this is stupid, but I need to redirect them from that page to the main site IF they are not below than IE8 OR using other browsers...
I fixed the IE users with this:
<!--[if !lte IE 8]>
But this code won't apply on Fiefox users...
How I could detect non-IE users and redirect them?
Thank in advance
The <!--[if ... ]> will only be handled by IE, that's the trick.
For redirecting Firefox or other browsers, you should better separate by user agent (but bear in mind, that changing the user agent is really simple!). This could be done using PHP for example:
<?php
$useragent = $_SERVER['HTTP_USER_AGENT']; //get the user agent
if(!strpos($useragent, "MSIE")) {
// user agents from IE should always look like this and include 'MSIE':
// Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64)
header("Location: http://example.com/");
}
?>
There might also be a JavaScript way by handling the user agent like this:
if(navigator.userAgent.indexOf('MSIE') == -1) { ...
But again: Keep in mind, that there could also be user agents, that could have "MSIE" inside their string or users with Internet Explorer, that will change it to "Firefox" or else. So this is not a fail-safe solution, but I guess, that could be an answer to your question.
PS: Why should anyway someone copy the URL from the IE conditional to its browser and view the "No IE wanted here" message? Anyone doing this should know, he isn't really using IE, so this shouldn't be confusing. You're making to many thoughts. You can't figure out all behaviors that other people will do ;)
You're just going to tie yourself up in knots doing what you're trying to do.
How about just displaying a message at the top of your page if users are using IE8 or less like in your original conditional statement?
Your message will simply suggest upgrading their browser or downloading Chrome, Firefox or whatever and also have the ability to close/hide the message.
<!--[if lte IE 8]>
.my-message {
display: block;
}
<![endif]-->
Related
i was wondering if it was possible to completly change the site, when viewed in IE?
Like have a site that would only work in IE?
As of right now, my site doesn't work quite as i wanted it, in IE9 or below, and i thought of making a different site simply saying something in the lines of "Your browser is outdated, please update 'LINK' ".
I dont want to put a banner on my website, as the website will still be seen behind it, and trust me, it is really ugly in IE9 and below.
Unless i can make the banner take up the entire page somehow?
Please help a new guy..
Cheers!
You can use something like WhichBrowswer to detect what browser/version someone is using and then redirect them to another page. All of this can be done in a few simple lines of js
An example:
$(document).ready(function() {
Browsers = new WhichBrowser();
if(Browsers.isBrowser('Internet Explorer', '<=', '9')) {
window.location.replace("http://example.com/upgrade-browser");
}
});
Use conditional statements in the head of your html (index.html) document that will specify what to do with specific IE browsers. See below for example for an IE 9 or less stylesheet. Below is saying if the user is on IE 9 or less then use this stylesheet and you can write specific styles. Also see the article link below for a detailed explanation.
<!--[if lte IE 9]>
<link href="/css/ie.css" type="text/css" rel="stylesheet" media="screen, projection" />
<![endif]-->
Reference - http://www.quirksmode.org/css/condcom.html
I have a site here
http://www.deltacars.co.uk/testsite/
The menu and hover work fine in all browsers including IE8 but when I go to the another page which is using the same html and css the menu does not appear correct
http://www.deltacars.co.uk/testsite/north-wales-private-hire/privatehire.html
Please note that this is only using IE 8.
Anyone know why it works fine on one page and not the other
Thanks in advance
The broken page is missing some conditional IE comments in the header. All you need to do is right click and view the page source to compare the output.
<!--[if lt IE 9]>
<script src="shiv/dist/html5shiv.js"></script>
<![endif]-->
<!--[if lt IE 9]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta4)/IE9.js"></script>
<![endif]-->
Give your website a thorough validation using http://validator.w3.org - my guess is that one of your 241 errors is causing this not to render correctly in IE8.
"Modern" browsers are intelligent enough to render elements correctly despite the mark-up being incorrect, hence why you're not seeing the problem on any others.
I'm a university student, and just built my first website for an internship. We are approaching the launch of the site, however during my debugging process I've found that of all places, it doesn't work on my boss's machine and browser combination. She uses a Vista OS and internet explorer 7 for a browser. I know IE7 is outdated, but according to broswershots.org IE7 will still render the site mostly correct on an XP operating system.
The main page of the site is accessible here
Here are screenshots of what happens with the Vista/IE7 combo:
Please let me know what you think, as any ideas would be extremely helpful. Thanks!
In your boss's browser, go to Tools, Internet Options, Accessiblity.
She may have checkboxes checked that override font settings.
"IE7 will still render the site mostly correct"
Sadly, no. IE has a long history of being crap and ignoring web standards. IE6 was notorious for this. IE7 a pain. IE8 a bummer and IE9 is mostly now just a small annoyance.
Bottom line is that you likely have IE7 bugs appearing. It's not necessarily indicative to bad markup or CSS, but rather just problems with IE7.
The typical solution is to use IE conditional comments to render a unique class name to the BODY tag. You can then over-ride the standard CSS just for a particular version of IE7 to bend it into submission:
<!--[if !IE]> -->
<body>
<!--<![endif]-->
<!--[if gt IE 8]>
<body id="IE9">
<![endif]-->
<!--[if IE 8]>
<body id="IE8">
<![endif]-->
<!--[if IE 7]>
<body id="IE7">
<![endif]-->
<!--[if lt IE 7]>
<body id="IE6">
<![endif]-->
And then in your css you can do this:
.myClass {...standard styles...}
#IE7 .myClass {...ugly hack just for IE7...}
#IE6 .myClass {...ugly hack just for IE6...}
I have seen a couple of answers that relate to my questions but can't seem to get the problem solved.
I am trying to use the conditional comments to target IE as per Paul Irish Boilerplate i.e.
<!--[if lt IE 7 ]> <body class="ie6"> <![endif]-->
<!--[if IE 7 ]> <body class="ie7"> <![endif]-->
<!--[if IE 8 ]> <body class="ie8"> <![endif]-->
<!--[if IE 9 ]> <body class="ie9"> <![endif]-->
<!--[if gt IE 9]> <body> <![endif]-->
<!--[if !IE]><!--> <body> <!--<![endif]-->
Doctype is 'transitional'.
I am testing a site on a local server and looking at the developer toolbar in IE8, the class that is placed on the body is 'ie7'
After a looking into to it I am using the following to try and render in IE8 standards mode hoping that the class put on the body would be 'ie8'
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
It doesn't work. I also used the JS here to tell my what mode IE8 is in. Its says IE8 standards mode.
Any idea how I can get the class on the body of IE8 to read 'ie8'? Or at least, not 'ie7' like it currently does.
Or is it just not possible to do this testing on a local server meaning I have to put it on a live server before I can make the changes I want? Which seems a bit crazy...
Thanks
If you are using a local server you are probably in IE8 compatibility mode. This is the default for local sites.
To check hit F12 and the developer toolbar should load. It will show you what browser mode and document mode you are using. IE8 should display for both.
You can disable the default behaviour by clicking "Tools" > "Compatibility View Settings" and change the setting "Display intranet sites in compatibility mode".
According to this page: "Note that IE8 claims to be 7 in Compatibility View"
If the excellent people at JQuery can't seem to sort that out, then I think the answer is probably no. :/
If IE8 is in IE7 mode then the browser is correct to report itself as IE7; after all, the intention of IE7 mode is to render the page exactly the way IE7 would have done, so if you're doing browser detection, you would want to be told it's IE7 because it's the IE7 behaviour you would have to deal with (the fact that there are bugs with IE8's IE7 mode, and that it isn't quite the same as a real IE7 is another topic altogether).
What you seem to be wanting is IE8 to actually be in IE8 mode. This is a reasonable thing to want!
You said you're using:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">
have you tried this instead:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
'edge' tells IE to use the most up-to-date rendering engine it has, which should force IE8 to go into normal IE8 mode. Maybe that would work better than telling IE8 to emulate itself?
By the way, if you're having trouble on machines in your local network with IE8 falling back to IE7 mode when you're not expecting it, be aware that there is a config setting in IE8 which specifies to "always use IE7 mode for intranet sites". This feature was put there by Microsoft to help with backward compatibility of custom-written intranet sites which didn't upgrade nicely to IE8, but frankly it causes more hassles than it saves. If this is the problem and you can't solve it any other way, you may find the easiest answer is simply to go to all the machines on your network and change the config setting (depending on the size of your network, of course!).
Just made a site using great standards compliant semantic HTML and CSS. It looks great in Gecko, Web Kit, but IE7 mangles it (of course). Any progress yet on this front, or do I have to go through a tonne of hacks as is standard with IE.
Try this
<!--[if lt IE 8]>
<script src="http://ie7-js.googlecode.com/svn/version/2.1(beta3)/IE8.js"></script>
<![endif]-->
Or you could write a separate css file for IE7
<!--[if IE 7]>
<link rel="stylesheet" href="css/ie7.css" type="text/css" />
<![endif]-->
There are several well-known hacks for hiding IE-specific demangling rules from comformant browsers. Most of them depend on IE mis-parsing certain things, e.g. "* html ... { }" which other browsers will ignore. A simple google search will show any number of these.
My rule is first to make the page work in FF (or similar), and then break it so it works in IE.
I find that developing a site first for IE, then adapting it to other browsers is less time consuming than the other way around. But, it's a little late for that!
I would suggest that you have a separate CSS file for IE (just copy and paste and rename current CSS) then have a browser sniffer and script that requests the IE CSS for IE users. Then rewrite just the IE CSS. Does that make sense? At least that way, the site is still up for the other browsers and you're just working on IE.