Display div only in IE

Question

I'm making a website at the moment and for some reason the z-index of a see through overlay is not working in internet explorer (it works in everything else), therefore I want to display a warning message that the website does not support internet explorer, how can I make a div with the class "Warning" show up only in internet explorer?

I am happy to this via any method (HTML, CSS, Jquery etc) as long as it either resolves the z-index issue or makes the warning div show.

Update: I had a friend of mine test my website and the conditional comments don't work in IE11, I want the div to be displayed in all versions of IE.

score 5 · Accepted Answer · edited May 23 '17 at 12:08

5

You can use a conditional statement to show the div:

<!--[if IE]>
    <div class="warning">...</div>
<![endif]-->

This will work for all versions of IE, if you want to target specific versions, see here for more info.

EDIT: As GSerg has pointed out, this will only work for < IE11. For later versions of IE, you may have to rely on some JS like in this Q&A: Browser detection in JavaScript?

edited May 23 '17 at 12:08

Community

1
1

answered Feb 28 '14 at 00:07

Dryden Long

9,332
2
28
42

2

This did work for me in IE9, however a friend of mine just tested it in IE 11 and there was no warning for him. – Mar 01 '14 at 00:35
@Aw555000 Correct, conditional comments are no longer processed in IE11+. Also the user agent string now says `Like Gecko`, which makes some web sites detect IE11 as a very old version of Firefox. Browser detection is bad for you :) – GSerg Mar 01 '14 at 00:37
Will this work for all browsers that aren't IE? – BennKingy Aug 15 '19 at 15:41

score 1 · Answer 2 · answered Feb 28 '14 at 00:06

Html5 Boilerplate recommends this solution (checkout this link for more details):

<!--[if lt IE 8]>
            <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->

score 0 · Answer 3 · answered Feb 28 '14 at 00:05

0

Wrap your html in a conditional like so:

the lt means 'less than'. You can target various version of IE by using lt, gt (greater than), lte (less than or equal to) and gte (greater than or equal to).

answered Feb 28 '14 at 00:05

essmahr

676
4
14

Display div only in IE

3 Answers3