Quick Tip: How to Target IE6 and IE7 with Only Two Characters

Jeffrey Way on Jan 21st 2010 with 173 comments

Did you know that, with the addition of only two characters, you can target both Internet Explorer 6 and 7 in your stylesheets? It’s easy…I’ll show you!

Subscribe to our YouTube page to watch all of the video tutorials!

At a Glance

#someElement {
   background: red; /* modern browsers */
   *background: green; /* IE 7 and below */
   _background: yellow; /* IE6 exclusively */
}

Enjoyed this Post?

Subscribe to our RSS Feed, Follow us on Twitter or simply recommend us to friends and colleagues!

By Jeffrey Way

Rollover to read this author's bio or click through to see a full list of posts by this author.

I'm the editor of Nettuts+, and love making the process of building for the web as easy as possible. I'm incredibly passionate about modern software development, and am the author of Laravel Testing Decoded! If you want be friends, say hi on Twitter.

Plus Premium

Note: Want to add some source code? Type <pre><code> before it and </code></pre> after it. Find out more

http://www.freshclickmedia.com Shane
Hey Jeffrey – I’m not going to criticise your screencast, but I thought the idea was to move away from non-validating, hacky CSS, and solve IE specific issues with the use of conditional CSS?

http://www.jeffrey-way.com Jeffrey Way
Author
Hey Shane – I’m not concerned with validation. You shouldn’t be either. :)
But sure – conditional CSS works too. It’s a matter of preference. Validation should be used to ensure that we haven’t made any typos, or left off a closing element, etc.

http://outthinkgroup.com Tim Grahl
Why shouldn’t we care about code validation?
http://www.jeffrey-way.com Jeffrey Way
Author
Rephrased — Why should you? :)
http://www.duzodesign.com Timothy
Like Jeffrey said, “validation should be used to ensure that we haven’t made any typos.” Meaning that is is good to check for human error but it is not critical to pass validation.
For example, if you have a strict doctype and you set an anchor target to _blank the document will fail validation. That doesn’t mean that your page won’t work. Or that there is something wrong. It just doesn’t meet the specifications of a strict doctype. No browser will stop you from using it though. Your end product will not be affected.
So, it is arguable if certain things that cause validation to throw an error are really doing any good when throwing said errors. Just like how target=”_blank” is argued.
Sean Curtis
I agree with Shane/Tim – hacks are bad. Well-formed (not necessarily valid) CSS is important. What happens if say FF/Safari/Chrome/Opera starts reading the hacks (yeah it’ll probably never happen) – you’ll be triggering more than just IE6 or IE7. As an added benefit, if you want to ever drop support for say IE6 and you’re using Conditional Comments, you can just remove the CSS file. With hacks you’ll have to go through the stylesheet and remove each hack individually.
There are plenty of blog posts out there explaining why NOT to use hacks – http://www.broken-links.com/2009/07/27/bad-advice-people-still-teaching-css-hacks/ provides some good arguments.
There’s no reason to use CSS hacks now that there are Conditional Comments.
http://www.airwolfe.com Alex Wolfe
Hi Jeffery,
Here are a couple of reasons:
First, when you decide to stop supporting older browsers (IE6, IE7), you’ll have to dig through your css files and remove all your hacks. If you take a little effort and add the conditional statement, you can simple remove one line of code.
Second, there is not guarantee how future browsers or devices for that matter will interpret invalid css. It’s quite possible it could cause problems.
Third, you have to know learn a special syntax (non-standard) for IE specific CSS.
Forth, once you adopt a methodology where you don’t care about using hacks its sure to spread to the rest of your work. Bad habits are hard to break and what may save you time now could cost you more in the long run.
Anyway, thanks for sharing. I usually really enjoy your articles and always enjoy the discussion. I think creating a quick tip series is a fantastic idea for nettuts. Some times its hard to find 30 mins to read a tut each day, quick tips will help tremendously. Thanks again, keep it up.
http://www.jeffrey-way.com Jeffrey Way
Author
Hey Alex,
To answers your notes:
1) I still don’t understand why it would one day be paramount to remove those stylings. Just let them stay in there.
2) This is the only valid argument about this method. It’s a very good point…not necessarily something that I’m worried about. But that’s always something to consider. Good point.
3) Not really “learn.” It’s a character. :)
4) Why isn’t it a “hack” when you declare the styles in their own stylesheet? Sure – it validates, but we don’t really care about that. It’s all just a means of hacking up your original stylesheet to work in one browser.
Thanks for the thoughts, Alex! It’s always a fun to learn from each other. :)
Chris
Jeffrey, it’s not a hack to create separate stylesheets for different browsers because that isn’t achieving the goal through non-standard means. A hack implies that your method involves doing something different–such as, in this case, non-standard or invalid CSS. As far as the larger argument goes, I’m not going to say you shouldn’t have CSS hacks in your stylesheets. Sometimes they are unavoidable. I also won’t say that you should stress out if your code isn’t 100% valid. However, it would not be wise to completely ignore validation.
Remember: the reason we have CSS hacks for IE is because the IE team did NOT adhere to the CSS implementation standards.

NeoNeuro
Really quick tip.. Thanks..
Joel
This is great, as long as you dislike valid code!
Jonathan Bennett
The one nice thing about IE hacks is that you can see all margins grouped as opposed to style.css having a margin, ie7.css having a different one and ie6.css having a third. If you need to change it in style, you also have to check it in the others.
I wouldn’t necessarily consider this to be the correct method but since all other browsers will ignore the IE specific properties, it does solve the issue and make it more maintainable.
http://www.duzodesign.com Timothy
Ah hacks.
I, personally, prefer IE Conditional Comments.

Oliver Sumpton
I like conditional comments too, but this tip is still handy and one I didn’t know!!

http://ikeif.net keif
This is an oldie – I remember dealing with these when I was under stricter limitations (couldn’t add IE conditional comments!)
And that is why I am against them – when the time came, it was a massive global search and replace across numerous CSS files because we were unable to do it right the first time, following it up with the bugs from having a few developers trying to manage the code.

http://redeyedesigner.com David B
I think this technique is a measure of last resort. I’ve had to do this from time to time. Especially in when I’m working with Drupal. I think conditional CSS is the better option, but as web developers we should know what tools can work to our advantage.
I’m starting to implement the universal IE6 style sheet that Andy Clarke wrote about some time ago. http://forabeautifulweb.com/blog/about/universal_internet_explorer_6_css/

http://www.ucarmetin.com/ Metin
Thanks David for sharing Andy Clarke’s approach to the problem.

http://www.wdonline.com Jeremy McPeak
Nice! I did not know this. Filing that away for when I need it.
http://sffarlenn.net Laneth Sffarlenn
Jeffrey, you have no idea how much stress this has just alleviated from my n00bish brain! Thanks so much!
The biggest thing I’ll have to remember is that I’ll have to comment my CSS so whomever looks after the site after me knows just what the hell I’ve been doing :D
Brad
Good one Jeff
http://www.virtualerik.com Erik
I also prefer conditional comments, mainly because I want my modern browser code to look hot.
I disagree with the validation though; as long as you know why it doesn’t validate, and you know what possible consequences it may have, it doesn’t matter!
Marshall
In my opinion, the amount of time this saves us as developers, as opposed to conditional HTML/HTTP_USER_AGENT/what-have-you is worth the cost of using a *somewhat* hacky or invalid approach. Kudos, Jeff, this will help me a LOT.
http://www.alfystudio.com Ahmad Alfy
What is that!! I’ve never heard of such thing!
I though you were going to implement this using Javascript or something but this is totally new!
How come we never heard about it? I’ve been working with markups and read a lot of books and tutorials and no one ever mentioned this!
Or maybe cause it doesn’t validate people just ignore it?

http://www.jeffrey-way.com Jeffrey Way
Author
It’s been around for a while. I think I’ve mentioned this technique in some of my older screencasts. :)
The underscore hack is pretty well-known, but I don’t as many people are as aware of the * method.
Stacy
This has been around/known for a while. I’m pretty sure I even read it in CSS: The missing manual. Maybe you’re just reading the wrong material.

http://luckykind.com Danny
It’s better practive to use IE conditional comments and separate style sheets.
1) it makes your style sheets less cluttered with nonsense…
2) when you decide not to support IE6 (which nobody should be supporting IMO) or IE7 anymore… you don’t have to scour through your CSS file and try and to remove lines with asterisks and underscores… you just delete the conditional comment and the related CSS file, that simple…

http://www.jeffrey-way.com Jeffrey Way
Author
In that case, do you use a separate stylesheet every time you use something like -moz-border-radius? According to your argument, you should be…
But yeah – external stylesheets work great too. This is just another option.
In reference to number #2 – There’s no huge need to remove IE6 styling from your CSS file. What would be the point? It doesn’t hurt to keep it in there. Or – you can write a 5 second regular expression and remove them instantly. :)

http://luckykind.com Danny
Come on Jeffrey! we’re not talking about separating out each browser completely here… we’re talking about separating OLD versions of browsers…
These hacks might be nice and convenient, but their not what CSS was intended to for… It’s also convenient to use tables for layout, but over the long run, it’s crappy and somewhere down the line it will cause pain for you or the next guy inline who has to deal with Table based layouts or cluttered, hack filled CSS files…
The point of removing IE6 or IE7 styles easily in the future, is that one day… you’re going to have to choose to not support it anymore… your going to add a new feature to a site, and it’s not going to work in IE6 or IE7 or both the way it should… and your going to say the heck with those versions…
Now all those hacks you have in your CSS file are meaningless because your site doesn’t even works for those browsers anymore… are you just going to work around worthless code? I like my code to be somewhat nice and tidy… just in case someone comes behind me to work with it…
Oh, and deleting a conditional statement and a CSS file is still a lot faster and easier than your 5 second regular expression… that’s if even most CSS coders know how to write regular expressions without botching their whole file… :)
http://www.wdonline.com Jeremy McPeak
There are merits to both sides of the argument. What it really comes down to is personal preference of how you want your CSS organized. If you want it broken into different files, then do it. If you want all style rules pertaining to one element in one distinct area, then this hack is for you.
After learning about this hack, I’ll use both according to my needs. I don’t care about validation, and frankly no one should. Basing your whole design philosophy around validation puts more work on you eventually. The real world doesn’t care if your HTML and CSS is valid. All it cares about is if your product works.

http://www.tonyvirelli.com Tony V
I would rather “scour through” my single CSS file then open different multiple web documents and delete my conditional code.

http://luckykind.com Danny
um… you should only be opening one web document… that would be the one that includes you header information… but have fun scouring…

Rich
Having separate style sheets for different browser rules is very bad practice IMO. The code might be a bit more pleasant to look through, but you’ll be adding unnecessary HTTP requests for each statement.

http://luckykind.com Danny
only for IE6 and IE7 users….

http://adrusi.com adrian
what’s wrong with invalid css, if it displays properly in all browsers and the code is organized, who cares

http://www.jeffrey-way.com Jeffrey Way
Author
Yep.

http://www.libeco.nl libeco
I understand why people hate IE6 so much, but when will web developers start thinking about their users instead of their code?
In the end a site is made for the users who really don’t care about valid or not, which browser or which version of HTML. All they want is a working website.
I find it really bad to disallow people with IE6 a proper experience of a website. Sure you can tell them that a newer version exists, but if they’re afraid of updating, it’s their choice. My grandmother started using an old laptop just for e-mailing and surfing to some websites. She’s afraid the laptop might break down if she does something wrong, do you really think she’ll attempt to update a browser?
I would love a web with standards all around, but IMHO it’s just not right to deny people a proper experience based on their browser.

http://www.whenimnotsleeping.com Bryce
I couldn’t agree more. Audience is and always should be king. I dislike coding for IE6 as much as anyone but if the target audience is corporate American (I can’t speak for the rest of the world) or older users then it seems ridiculous not to cater to their platform. Anything else is just bad business. You won’t change the user’s mind and the money will just go elsewhere. On the other hand if your target is the ad agency down the street running the newest macs with bleeding edge safari then by all means use HTML5/CSS3 and ignore issues with IE (or whatever other browser you dislike).
Not understanding and providing for your audience is like a fast food burger joint that only servers people who arrive in a Ferrari. You might have the best burger/food/signage etc around but its wasted on the normal person because its inaccessible.
As for dropping support for some version of a browser, are you really going to go to the effort to “remove” support? After you’ve gotten it working why would you want to remove code that makes something work? Typically ending support means that new features or versions may not work properly with a browser but not that you would ever remove support from existing features.
http://luckykind.com Danny
I couldn’t disagree more…
IE6 is a security nightmare… do your really want your Grandmother to deal with hackers? viruses? etc…
Dropping support for older browser versions means people are forced to upgrade… and it’s actually helping them, because they are upgrading to a more secure version. That means they’re safer, and you and I are safer…
Developers who support IE6 are as much of a problem as people who are using IE6… people and corporation aren’t just going to stop using the internet because sites don’t work in IE6… so if we force them to update their browsers, just like we force people to keep their cars in safe conditions… the world will be a better place… at least on the net :)

Warrick
Forcing corporations to drop IE6 wont work. The reason they require IE6 in the first place is due to software developers who have not updated their applications to work in conjunction with modern browsers.
I work in Education and we have one application that forces all staff machines to run IE6. If we change to IE7 or now IE8 it stops the database merge from working within MS Word.
We cannot use other browsers either, the system is set to recognise only IE on department computers. So updating to FireFox, Safari or Chrome is out as well.
I develop my schools website and I just no longer cater for IE6 because the only people using are the staff or other department offices.
Just move on.
Will
Granny wouldn’t deal with that, she’d just call the grandson to do it for her
ken
Danny, Re: security in IE…Every machine I have, had to apply the “Security Patch” issued by Microsoft on thursday. The patch was IRT Chinese hacking Google code. The point is the patch affected IE 6, 7, and 8. My point is that in some aspects security is weak in IE no matter what the version. My browser of choice is Firefox but I still have to write and test for everything…
Hello
“Dropping support for older browser versions means people are forced to upgrade… and it’s actually helping them, because they are upgrading to a more secure version. That means they’re safer, and you and I are safer…”
That would be like TJ Maxx saying they were no longer going to cary plus sized clothing because they wanted to reduce obesity. Do you really think your wife is going to start going to the gym? Nope she’s going to drive her rascal scooter down to Ross and gettin her some designer outfit fo da club on saturday. Really all your doing is helping out your competition.
Danny it’s condescending comments like yours that make people not want to ask questions or express their findings. I understand if you don’t agree but don’t be a dick about it.
Jeff, Thanks for doing what your doing and keep up the good work!

Laurent
What you don’t seem to understand is that by trying to cater to IE6 users you’re punishing all the other users. It brings up the cost of web development and slows down progress.
Imagine trying to make every road carriage friendly because some people do not like to use cars? It makes no sense.
At some point, you’ve got to move forward.
Rich
I agree as well. The misconception a lot of people seem to share about ie6 is that they are all misguided home users. They certainly exist, but there are also lots of people who have to use IE6 on there work/school/whatever computer because they aren’t able to upgrade themselves.
Building sites with progressive enhancement is fine, but to actively turn away users is unprofessional and amateurish. Plus, if you hate IE6 wait until you try developing for mobile!
Regarding the tutorial itself – I think both techniques have their place. Conditional statements are definitely cleaner, but for high traffic sites the ‘hacks’ might work better as CSS statements can become expensive with very large style sheets. As with most things on the web, it depends on the situation.

http://luckykind.com Danny
Work/Schools don’t upgrade because there’s no need to upgrade when everybody keeps catering to them…
Some would say supporting a browser that is full of security holes is unprofessional and amateurish…
Rich
They don’t upgrade because it’s a huge cost for large organizations to install new software across their networks. They also often have custom applications made to work in IE6 so require that to be the primary browser. Whatever the reason, actively turning away potential customers based on your ideals about web standards is clearly not a good idea.
I take it you’re a freelancer as this attitude would not be tolerated in a real agency.
http://luckykind.com Danny
Yes Rich… I am a freelancer, what is it that you do? “amateurish”, “real”, “unprofessional”… your jibes are growing tiresome, I’d send you to the corner at my house for being unable to hold a civil conversation… ;)
Before that I spent 5+ years doing development for a company who’s large government customer base was dependent upon IE6… I also have someone very close to me as a high ranking officer in a government organization… I know how it is for companies and their IE6 dependency…
So are we to support IE6 forever? At some point these government agencies/corporations/etc are going to have to spend the money to upgrade… and they’re not all going to do it at the same time… IE6 is almost 10 years old… and there’s 2 versions that have come after it and a third in the works… we can’t keep feeding the sick cow forever… at some point it needs to be put out of it’s misery… and throwing jabs at people trying to educate others unto better and more secure ways… well, I won’t go there…

Ant
Then it user problems, if they don’t want superior software.

Amaury
Holy … you know !
This tip will save some many times !
Thanks, thanks thanks !
vengen
Useful tip. Thank you :)
Btw
Jeff… Is there a chance to watch new “JS lessons from scratch” in the nearest future?
Best wishes

http://www.jeffrey-way.com Jeffrey Way
Author
Yeah – a new entry should come out tomorrow or Saturday.

Webfreak05
Jeffrey, could we get a screencast on accessibility testing? Like with screenreaders. What is the most common screenreader that disabled people use? Thank you :)
http://www.jeffrey-way.com Jeffrey Way
Author
I’d love to…but I could use one myself!

Daniel
…quick and dirty – I like it!
:)
http://stvproductions.net S.T. Verschoof
I already love the quicktips!
Very handy Jeffrey!!!
Micko
This is great, more like this.
http://rainworld.com Sean Monteverdi
I’ve been using this hack for building, primarily. As I’m working in one stylesheet I’ll use these to quickly make needed adjustments for problem browsers, then move these to their own conditional stylesheets for final production. Fits into my workflow well.

http://sffarlenn.net Laneth Sffarlenn
This seems like a fair compromise, if one has the time – it makes me wonder why all the hot-headed commenters above haven’t thought to do just this?
My guess would be because it adds time and work to their schedules they’d consider unnecessary.
Would I be right in guessing you simply use a “CTRL + F” (Find) search to select each line and then just cut and paste into a new document? It’d be how I’d imagine doing it – makes a LOT of sense, actually, if considering using these shortcuts.

Mil
Wow…I never knew this. Doesn’t seem to be too popular.
Thanks though.
http://www.slicemachine.com Zoran Jambor
If you want to target IE6 only, you can use one of this:
.someElement{ background:red; } -> Modern browsers including IE7
* html .someElement { background:yellow; } -> IE6 only
or
.someElement{ background:red !important; background:yellow; }
Because IE6 ignores !important rule.
Both techniques validate.

http://www.wexcode.com Adam Wexler
Gotta say I agree with these methods more than the posted one. Either way, I’ve found that good, valid code is a better solution in most browsers, and that these are only good to rely on as a last resort. More often than not, these hacks really aren’t the best way to go about things.

ziggidy
If Microsoft keeps coming out with new browsers, they are going to run out of special characters to target their next browsers.

http://www.chrismarshall.designerscouch.org Chris
LOL that is an awesome comment.
http://www.donothavedomainyet.com Eugene
Still lol after an hour of lol)))
http://sffarlenn.net Laneth Sffarlenn
Dude, if we had up-votes or ratings here, you’d be quite popular right now :D

Sean Foushee
I agree that for a production site it’s most likely best to use conditional comments, but you know what would be great? Someone writing a regular expression or online app to take a CSS file formatted with these hacks and spit out three separate files: a valid CSS, IE6 Conditional and IE7 Conditional.
Then everyone is happy!
However, I still don’t see how this “tip” will really save me enough time to justify hacking-up my valid CSS.
Jeremy
The biggest problem with using hacks is future browsers. If you’re using invalid hack code, instead of browser supported conditional statements there maybe be some new browser in the future, maybe even non IE that parses that code improperly. That is why you should use conditionals as much as possible.
That is the other purpose to validation, beyond catching your own mistakes, is to ensure your code is forward compatible.

http://www.wdonline.com Jeremy McPeak
The same statement could and should be applied to the extensions that Firefox, Webkit, and Opera use to implement non-standard (but coming) rules. Thing is, pretty much all browsers ignore rules they don’t understand. Unless * and _ become valid CSS prefixes for rules, there’s nothing to worry about.

http://www.wdonline.com Jeremy McPeak
Err – properties, not rules. Not enough caffeine this morning.

http://www.donothavedomainyet.com Eugene
Jeff, will it work fine with not-IE browsers as well, for example if I set like in a example here, will it be red in FF, Opera, Safari, Chrome still or it depends on some options or specified versions?
Also does it mean if I want to do design for all kinds of browsers, should I add for every atribute three lines of code or is there an optimized way?

http://www.jeffrey-way.com Jeffrey Way
Author
IE8 and all modern browsers will ignore the * and _ hacks.

http://www.donothavedomainyet.com Eugene
Also does it mean if I want to do design for all kinds of browsers, should I add for every atribute three lines of code or is there an optimized way?

http://www.monoroot.com Paul
Of course, valid code is good practice, however who *actually* checks sites for such things other than other web developers? Clients just want sites that work consistently in most browsers.
I’ve spent so much time ensuring my code validates for no other reason other than my own borderline OCD!! :-)
I might start resorting to these hacks in the future, it’ll save so much time.

Eben
It’s not an issue of people checking the validity of your code, it’s an issue of taking pride in the craftsmanship of your work.
People thought tables were ok for positioning because it looked the way they wanted in browsers. That doesn’t make it ok.
Most importantly, why bother when conditional commenting is so easy to use and provide clear segmentation to easily update.

http://www.monoroot.com Paul
Fair comment, however it’s not really justified to make a comparison to building a website in tables. People have moved away from that, simply because it would be stupid not to.
However, the point I’m making is that a CSS-based site that works in all browsers is – regardless of the occasional IE6 ‘hack’ – all a client wants. Yes, I personally ensure my code validates and do take pride in that fact, however most clients wouldn’t care or know either way.
http://www.wdonline.com Jeremy McPeak
But then there’s the real world, where results matter more than the validity of your code.
If there’s one thing I’ve learned from transitioning from a hobbiest to a professional, it’s that time spent on making a fantastic product is much more important than time spent making sure code validates. Some environments offer you the luxury of doing your job “the correct way”. At the same time, many other environments don’t.
At the end of the day, all that really matters is the end-result. If that means skipping out on one thing (validation) to add that extra feature or fix that meddlesome bug, then that’s absolutely fine and dandy.

http://www.jeffrey-way.com Jeffrey Way
Author
Bottom line – this screencast’s purpose was only to demonstrate one option…one that everyone should know – even if only for testing.

http://wpcoder.com Dan Philibin
Valid code isn’t always important. If you know the rules, you can break them. With all the browser consistencies present today, I would think valid code would be the last thing on people’s minds.
Nice quick tip.

http://twitter.com/maxberndt Max
exactly!
If all browsers would stick to standards I would agree starting to worry about code validation. I mean, how can food validate when the eater doesn’t. Eg: IE is the eater who, when served with valid food, will vomit (break design). So all you can do is hand him some manipulated food to keep him healthy.
In order to quit this vicious circle we would have to cure our charge first an then give him normal food again.

Eben
It’s not an issue of people checking the validity of your code, it’s an issue of taking pride in the craftsmanship of your work.
People thought tables were ok for positioning because it looked the way they wanted in browsers. That doesn’t make it ok.
Most importantly, why bother an invalid technique when conditional commenting is so easy to use and provide clear segmentation to easily update.
Valid CSS may not be a huge deal, there’s certain things that may warrant breaking validity. Progressive enhancement and trying out implemented pieces of CSS3 may be worth it, but why invalidate CSS for no good reason with something that can be done easily in a valid way?
I understand the gimmick of the post, but I think we should be pushing better methods within the community.
Miguel Navarro
Fantastic tip, thanks so much!
Mike T.
I weep for the future of the web. Thanks Nettuts!
http://sohointeractive.com SohoInteractive
totally agreed with eben
“It’s not an issue of people checking the validity of your code, it’s an issue of taking pride in the craftsmanship of your work.”
F.
Kel
I recommend you all just become corporate developers so you can deal with a single browser. Solved. I’m firmly in the no hacks camp, but it’s just another religion.

http://www.jeffrey-way.com Jeffrey Way
Author
Get a dang gravatar, Kel.

http://www.jeffrey-way.com Jeffrey Way
Author
Preeche.
Kel
So excited that now I have a picture next to my name….and it travels with me wherever I go. And it’s backwards compatible!
http://www.jeffrey-way.com Jeffrey Way
Author
But back to hacks – it’s, in my opinion, a matter of weighing the advantages and disadvantages. I don’t think a simple little “hack” to fix an IE6 bug, is the same as something like user-agent sniffing with JavaScript.
The “what if future browsers render those stylings” argument is a very good one. But, you also have to consider the advantages of your CSS being more maintainable. If I have margin-left: 40px; in my main stylesheet, and margin-left: 20px; somewhere in my IE6 one…it’s very possible that months later, I’ll have no clue why I placed it there.
http://www.jeffrey-way.com Jeffrey Way
Author
And besides – I wasn’t necessarily advocating that this was the correct method. It’s merely an option…and a smart thing to know.
Kel
it give me a very dirty feeling to know that complaint browsers are parsing a css file inherently designed to be keyed to standards and ignoring things they don’t understand. that poor css-parsing state machine doing all that work for nothing. Adding bugs to fix bugs… but I really don’t care. I code to IE8 and that’s all I have to worry about! ;-) And it’s quite pleasant actually.

Kel
Didn’t say you did… (advocate) I’m commenting to the community not the author.

http://sonergonul.com Soner Gönül
That’s great !
Thansk !
Cool !
http://maxberndt.tumblr.com/ Max
thx Jeff, love these quick tips! Keep them coming!
ThE_OwNeR
But in the end isn’t it about what the client wants? If he want a site up and running on 12 o’clock, and i can solve a issue with these hacks within 2 hours, why would a not use it if it takes longer without hacks?
I don’t have a real company so, but i’m satisfied if my code works :)
http://www.crearedesign.co.uk Stephen Webb
It’s interesting to see this approach to the issues caused by Internet Explorer 6 and 7, and the reaction about the “hacks” not being valid has got. Generally it’s great to see any code that can tackle and solve issues brought forward by outdated browsers.
As for the validation it has been eye opening to read the comments associated with the importance of a page being W3C compliant. While I agree that it’s not essential for pages to be valid, in that it wont stop browsers from read the pages or users from using them, I do think a general point about SEO has been missed.
While no one knows for sure if validation is taken into account in Google’s algorithm, it is safe to say that having a page validate is certainly not going to hurt it’s SEO prospects. I obviously understand that SEO is a different issue here, and that not every site requires it, but using this “hack” for sites that will be optimised may result in its SEO success being impacted.
http://www.andrewckor.com Andrew Ckor
Jeffrey i want to complete your tutorial!!!
Its another one sign that help with IE 8 and below and its this \9
ex. height: 100px\9; /* IE 8 and below */
Thanks:)
Karan Saini
Thanks for the good tip.
One question i have, do * and _ applicable to other stype properties such as border etc..

http://sffarlenn.net Laneth Sffarlenn
From the general feel of the Quick Tip and the community discussion here, it seems you could almost prepend any of your CSS properties with * or _ to achieve the “hack”.

http://www.jeffrey-way.com Jeffrey Way
Author
Correct.

http://www.celwinfrenzen.com Celwin Frenzen
Thanks very much Jeffrey! Your a genius :-)
http://www.graphicrating.com/ Andy Gongea
I hate conditionals and hacks. I try to design sliding between browser’s drawbacks.
Davinder
What’s the use of this?
tjedgar
I don’t know whats going on, but the *background trick on my quick test changed the colour in IE8 not just 7
Marco
It’s a quick fix people and should only be used VERY occasionally.
It’s amateur these days to care if your css validates perfectly. I know most of you are new and inexperienced but get over it. Nobody gives a shit if your css has an error or two.
Nick
Stop catering to IE6. If we keep spending all our time making things look pretty in IE6 people will never stop using it. Even Microsoft is pushing people to abandon IE6.

http://www.wdonline.com Jeremy McPeak
That’s the chicken or egg argument. Personally, human nature dictates that the user won’t return to your site if it doesn’t cater to the browser they use.
Picture your site as a store. A customer walks in, grabs some items, and heads to the checkout counter. There, they pull our their American Express card, and the teller says, “I’m sorry. We don’t accept that card. We only accept Visa and Mastercard.”
“But this is the only card I have, and I don’t carry cash,” says the customer.
“I’m sorry, but we don’t accept your card.”
Do you think that customer is going to return to your store? Probably not. They know you don’t accept their card, they don’t want to get a Visa or Mastercard just to visit your store, and they don’t want to stop at the ATM before every visit. So they’ll go somewhere else to get the items they want.
People don’t upgrade their browsers. They don’t download a different browser unless a tech savvy relative does it for them. Ignoring them only sends them somewhere else to get what they want. That’s bad from a business perspective.
Of course, if you have proof your site gets very little traffic from users with IE6, by all means ignore them. But if they’re a sizable chunk of your traffic, you’re only hurting yourself by ignoring them.

Mike
Many good points here. On both sides. Unfortunately many of you aren’t living in the real world. You can’t tell a client, “oh your company uses IE6/7, sorry you can’t use the site that you just payed us build. And by the way, any of your potential customers, many of which may or may not use an older browser are out of luck too. But thanks for that big fat check.”
I’m fine with this “small” hack, as it is a time saver. And time is money. Also, my personal preference isn’t to manage multiple css if I don’t have to. For me it’s easier to know that the margin, for example is all in one spot. instead of having to go through two or three files.
There is a difference between pride in your work and using the right tools for the right job at the right time.
http://www.jordanwalker.net/index.php Jordan Walker
Unfortunate that we have to hack our beautiful code to cater to IE.
http://www.markdijkstra.eu Mark Dijkstra
Nice, i didn’t know the IE7 one ;)
teebee
I don’t care about the content of the screencast so much as I’ve never seen the software you used to test the css in different browsers! What is that “IE Tester” software you used and can you provide a link? Has everyone else been using this and I didn’t know it existed?

teebee
I found it here: http://www.my-debugbar.com/wiki/IETester/HomePage and now the question is for the people that have already tried it or is using it…is it worth the download? I’m downloading it now and I will try it out.

http://www.spreadgun.com tom
absolutely
Anna
Definitely worth it.
I tried using XP virtualization on Windows7 Ultimate, which can have a completely native version of IE6, but it’s slow and the colors don’t render correctly.
But between the layouts on native IE6, and IETester, I have never seen a difference. I only use XP virtualization for a very final test to make sure that all the functionality works (forms, certain javascript, ect)
http://sffarlenn.net Laneth Sffarlenn
I’ve had IETester for a while now and have found it invaluable – for someone who is still only new to the design & dev arena, this saves me having to learn how to run virtual browsers or do weird things to my OS to get multiple versions of the browser to run – I just don’t have the time to learn that stuff when I’m trying to learn coding languages and proper practices.
I highly recommend it, not only cos it’s free, but because it works great for active sites online and those on your local file system / localhost.