Today is Day 11 and all about Internet Explorer.

Unfortunately.

So now before we go forward, Internet Explorer has taken a lot of liberty to try and improve their software.

And they're on, like, version 15 or something crazy.

Right now, I don't really pay attention because I don't really care.

But hopefully you're watching this at some point in the future where none of this is an issue anymore.

However, there are some people who still use Internet Explorer nine and below, which is crazy talk.

But luckily and CSS three and CSS weekend, we can kind of make some accommodations, and in my case, I just like to remove the styles for those browsers altogether.

So I'm gonna show you how to do that with something called conditional comments.

Jump over here and check this out.

You can see here.

I'm gonna show you what a conditional comment looks like and what it does So basic conditional comment looks like this.

If i e and it's wrapped in basically an html comment, and then you put any HTML in between, including links to CSS like a different III style shoot.

Ah, and then you close it off, like so you could select different types of browsers.

Internet Explorer versions rather 6 79 By using the following conditional comments, you can use a specific, conditional comment for, say, a version of Internet Explorer or lower.

So if lt stands for less than or equal to 678 or nine that styles Internet Explorer six or less seven or Les aider les nine or less.

Or rather, those browsers register those comments, and then we have the opposite of that, which is greater than or equal to.

So you could sell greater than or equal to a 678 or nine.

Or I just like to use the, uh, the catchall if I e so that's Internet Explorer six through nine and that will be recognized and rendered by those specific browsers.

So jump over here in our code editor and all we have in Day 11.

You can go ahead and download.

That is an index file and Anaida CSS file.

Gonna run through them, show you what's going on, and then we could be on our merry way and not think about AII anymore.

So right here You can see in the head of our HTML.

I have a conditional comment that selecting AII six through nine and I'm just adding and I'II style sheet.

So on Lee Intern Explore, 69 will recognize and render that comment and then will tie into our CSS file, which looks like this.

Basically, I'm just I didn't asterisk selector, which is a catchall everything on removing the background color and line height, resetting that really aggressively removing the course files button and the Level two heading Tab that sits on the side of the container in the Web page that we have here.

And then I found a complete CSS reset at this link.

That's just unaggressive.

Reset just resets everything to just basic black and white text.

And that's all I want for AII six through nine, because I don't wanna have to accommodate those browsers.

So I just showed them my markup, which, if it's semantic, they should be able to read it and get the meaning of the Web site anyway.

So let me just go back to our brows are index html file here.

I want to show you one last thing I've done right under the conditional comments.

I've put conditional comments through from six through nine and basically just some texts.

So if you're this is a test method.

So if you're viewing it from 678 or nine, you'll see the proper the respective comment for the browser that you are using.

So why don't we test that I've taken the liberty of uploading this to my website, my domain, and ah, there's a Web page website called net renderers dot com, where you convey basically, get a screen grab of a naive browser of a live Web page.

So if you go two net render and type in Brad House did not see a slash dev slash u E w w on choose Internets more nine because for some reason, seven and eight don't work on my website, but nine does.

And if I get render basically what's going to happen?

Is this gonna take a few seconds and then it's gonna give me a rendering?

Screenshot of what?

Inter next?

49 How it sees my website.

So here you go.

It's a basic black and white.

It's got the text.

You can read it.

Ah, and then, if you notice here your viewing with intern explore.

Nine.

You can't see that in my chrome browser because obviously it's on.

AII but here it it's your viewing with Inter next 49 and the styles are completely wiped so that all they can do is read it perfect.

That's all I really need.

So I know that was kind of a quick lesson, but feel free.

If you really care to utilize this strategy on your own blog's and websites, if you just want to remove the styles altogether, you could do simply what I did.

Or if you want to take a little bit more of an accommodating approach, you can do that as well.

Play around.

There are a number of different, uh, browsing test browser testing tools such as browser Stack, but that's paid.

Where's that render is just a screen grab of what e.

Sees your website.

How it's easier up site.

So really, that's kind of all.

I don't want to spend a lot of time on this because it's quite simple, conditional comment on AII CSS file and just remove the Stiles pretty straightforward.

Uh, I hope you're having a great day and tomorrow I'll see you in a 12 which is gonna fund.

We're gonna be playing around with some CSS three variables.