How can I detect that user use IE7 or IE6.
I made a google search but I was confused.
For example does [B][U]this[/U][/B] link works ok for IE7 or IE6?
Meaning that navigator.appName returns “Microsoft Internet Explorer”
Typically by using object detection that relates to the problem you’re trying to solve.
What’s the problem?
I want to use javascript to set some css if browser is IE6 and 7.
Till now I set it if browser is IE.
Also this site use moo tools so it has built in functions detecting the browsers (I did not use mootools )
The best way to do that is without JavaScript.
Using HTML conditional comments you can guarantee that it will work even if javascript is disabled.
<!--[if (gte IE 6)&(lte IE 7)]>
<link type="text/css" rel="stylesheet" href="ie6-7.css">
<![endif]-->
The first problem is that I want the text of my “text div” to be in the middle of this div if it is “little” for example below 300 characters,so I want some css for IE6,7.
Look this.
Why do IE6 and IE7 exclusively require the additional CSS codes? Because they need fixing in some way that IE8 or IE9 don’t require?
If that’s the case, there are CSS specific techniques that easily achieve that without the complexities of scripting.
For sure.
But I need to know if text has bellow 300 (for example) characters ans so to give the new css.
Can I do it with out javascript?
How can I use plain css to find the characters or to give instructions like
if (mydiv.chars<300) {css code}
Notice that there is already a css file.
Why is IE6 and IE7 receiving the special treatment, while IE8 and IE9 are not?
I am a newbie at css.
This was the suggestion at css forum.
Maybe IE6 is too old for some css…as I notice for an error that gave me with that code…
(My IE6 give an error for display:table-cell at javascript code)
Let me ask this another way.
Please show us HTML/CSS code that have which works fine in IE8/IE9, but doesn’t work as expected in IE6/IE7
I change the css I had but
$('content_text').setStyle("vertical-align","middle");
worked at my firefox but not at my IE6 (I havent newest IE 
)
This worked at IE6 (maybe I do some error…)
$('content_text').setStyle("position","relative");
$('content_text').setStyle("top","35%");
What is the HTML we would need to use with that experience the problem?
We cannot develop a working solution if we cannot experience the problem.
Test for functionality, not for browser version. The IE family has the If IE tags for use with HTML and CSS, but in javascript it is best to check to see if an object exists before attempting to use it.
By testing for functionality you get a bit of future proofing, but also you don’t need to worry as much about things breaking in other browsers.
You are right but also at my situation for example the code
$('content_text').setStyle("display","table-cell");
give an error at my IE7,IE6.
Then use object detection as we have all been saying, to determine whether the web browser is capable of supporting such techniques.
jQuery makes this easy. It provides useful support for object detection. Checking for box model support would be appropriate here.
if ($.support.boxModel) {
$('content_text').setStyle("display","table-cell");
} else {
// IE6 and IE7 will run the code in this "else" section
// ...
}
What would you have the IE6/IE7 browsers do instead?
I understand but also this site use mootools (We make a few changes).
Is there a way to do this with mootools (or a more generall way)?
Sure thing. You can a 1 pixel div with 1 pixel of left padding, and check if its offsetWidth is equal to 2. If it is, then you know the browser has proper box model support.
That’s the precise technique used by jQuery to check for box model support.
// Figure out if the W3C box model works as expected
// document.body must exist before we can do this
jQuery(function() {
var div = document.createElement("div");
div.style.width = div.style.paddingLeft = "1px";
document.body.appendChild( div );
jQuery.boxModel = jQuery.support.boxModel = div.offsetWidth === 2;
document.body.removeChild( div ).style.display = 'none';
div = null;
});
Wrapping that in the MooTools wrapper without the jQuery stuff, and adding a few explanitory comments, we get this MooTools type of code:
window.addEvent('domready', function() {
function hasBoxModelSupport() {
// Figure out if the W3C box model works as expected
// document.body must exist before we can do this
// Setup
var isSupported = false;
var div = document.createElement("div");
// Test
div.style.width = '1px';
div.style.paddingLeft = '1px';
document.body.appendChild(div);
isSupported = (div.offsetWidth === 2);
// Cleanup
document.body.removeChild(div).style.display = 'none';
div = null;
return isSupported;
});
if (hasBoxModelSupport()) {
// yay, box model support
} else {
// boo, IE6 or IE7
}
});
Thank you.
I fix it and now I do not use any browser detection.
Well done. I feel sorry for all those people checking the first digit of the browser version number. They’ll be okay with IE9, but when it goes to IE10 they’re going to have real trouble.
I truly believe we all should stop supporting IE6.
It was made 10 years ago and the web has gone far.
In my company - <snip/> I insist we don’t provide IE6-optimized sites anymore.
It’s just not efficient from the business point of view to spend time optimizing a contemporary site for IE6.
I prefer coming to the client’s office and making them install a modern browser )